CODEWITHSUNDEEP
jquerylimitjquery-ui-sortablemax
Ben
Ben

Reputation: 11188

Limit jQuery sortable list

I'm working on a project where I need to schedule persons in rooms. I'm using jQuery sortables to achieve this task. The only 'problem' is that there is a maximum capacity for a room. E.g. some rooms can have max. 3 persons, others 4 and some maybe only 1. So after browsing the jQuery documentation I came up with this.. only, it's not doing anything. The part between onStart: function(){} is created dynamicly by PHP.

Do you guys have some experience in setting up a max no. of items in a sortable list and check for that?

$(function() {
    $(".sortable, .connectable").sortable({
        connectWith: '.sortable, .connectable',
        helper: 'clone',
        cursor: 'move',
        onStart: function()
        {

            if($(".room-1-1").sortable('items') == 2)
            {
                alert("Maximum reached..");
            }


            if($(".room-1-2").sortable('items') == 2)
            {
                alert("Maximum reached..");
            }

                        }
    }).disableSelection();
});

Upvotes: 0

Views: 2649

Answers (3)

Ben
Ben

Reputation: 11188

Easily solved it by craeting a javascript function which checks the number of LI elements in a specified DOM element.

Upvotes: 0

Wookai
Wookai

Reputation: 21723

First, the event you want to hook on is not onStart, but simply start, according to the doc.

Then, as thenducks said, I don't think your way of counting the elements is right. You can do it whithout using sortable for counting :

if($(".room-1-1 items").length == 2)
{
    alert("Maximum reached..");
}

where items is the selector on the types of elements in your lists (may be divs, lis, a CSS class, etc..).

Upvotes: 1

rfunduk
rfunduk

Reputation: 30432

It seems to me you are just missing one piece, in Firebug, try:

$(".room-1-1").sortable('items')

You will most likely not see a number of items, but rather a collection of elements. So then, what you want is:

if( $(".room-1-1").sortable('items').length == 2 ) { ... }

Upvotes: 0

Related Questions