How To Limit JQuery Selectable-helper's Range?

Question

I have a Table with JQuery's selectable feature.My Table was selectable each td which are in the same column. Below is my full html

Solution 1:

Not sure if I got your question right.

Do you want to achieve something like this?

So for this example it allows you to select only columns that are defined between columns range.

Baca Juga

var columnsRange =[[0,1],[2,3],[0,3],[0,3],[1,3],[3,3],[1,3]];
var currentCol;
     $(".scheduler-container").selectable({
                filter: ".item",
                start: function(event, ui) {
                    $(".item").removeClass("ui-selected");
                },
                stop: function(event, ui) {

                    //Reset selector. 
                    currentCol = undefined;
                },
                selecting: function(event, ui) {

                    if (currentCol === undefined) {
                        currentCol = $(ui.selecting).index();
                    }                
                    var nthChild = parseInt(currentCol) + 1; //Add one as nthChild is not zero index
                    for (var i = 1; i <= $(".scheduler").children('tbody').children('tr').children('.item').length; i++) {

                        if (i != nthChild) {
                            $(".item.ui-selecting:nth-child(" + i + ")").each(function() {
                                $(this).removeClass("ui-selecting");
                            });
                        }
                    };
                    if (!isInRange($(ui.selecting))) {
                       $(ui.selecting).removeClass("ui-selecting");
                     }
                }
     });

function isInRange(cell){    
    if (cell.closest('tr').index() >=columnsRange[cell.index()][0] && cell.closest('tr').index() <=columnsRange[cell.index()][1])
    {        
        return true;
    }
    return false;
}

JavaScript Controls

How To Limit JQuery Selectable-helper's Range?

Solution 1:

Post a Comment for "How To Limit JQuery Selectable-helper's Range?"