0

I would like to prevent a connected jquery-ui sortable List to accept no more Items than of a given number.

I came this far: http://jsfiddle.net/9yzea/6/

What to add in line 66 to prevent "#playlist" to react on an new item hovering above it? I would like it to react with sepcial behaviour since its "full". Or is there a better approach?

Thank you

$(function() {   $( "#playlist" ).sortable({
    cursor: "move",
    handle: ".handle",
    revert: 100,
    opacity: 0.8,
    delay: 50,
    placeholder: "sortable-placeholder",
    stop: function(event, ui) {
        var size = $("#playlist li.track").size();
        $("#music").append(size+" ");
        sizeCheck();
        if (playlistFull) {
            $("#music").append("full ");
            } else { 
            $("#music").append("space ");
            };
        playlistWatcher();
        },
    start: function(event, ui) {
        if (playlistFull) {
            // $(ui.item).sortable('cancel');  // What to do here?
            };
        },
    }).disableSelection();
});
4

2 に答える 2

0

現時点での最善の策は、ソート可能がいっぱいになったら無効にすることです。

function playlistWatcher() {
    // $("#music #playlist li a.addrem").html("remove");
    // $("#music #tracks li a.addrem").html("add to playlist");
    if (playlistFull) {
        $("#alert").show();
         $( "#playlist" ).sortable("disable");
        //$( "#tracks li" ).draggable("option", "connectToSortable", null );
    } else {
        $("#alert").hide();
        }; 
    };

更新されたフィドル

私はより良い解決策を模索しており、見つけたらお知らせします。

于 2013-02-15T06:21:39.990 に答える
0

編集

stop:次のようにアイテムを削除できます。

    stop: function(event, ui) {
        if (playlistFull) 
           ui.item.remove();
        var size = $("#playlist li.track").size();
        $("#music").append(size+" ");
        sizeCheck();
        if (playlistFull) {
            $("#music").append("full ");
            } else { 
            $("#music").append("space ");
            };
        playlistWatcher();
        },
    start: function(event, ui){
        if (playlistFull){                       
            $(ui.sender).draggable('cancel');
        }
    }
于 2013-02-07T16:35:00.690 に答える