Оповещение о сбрасывании заказа - JQuery - PullRequest
Новая
       2

Оповещение о сбрасывании заказа - JQuery

2 голосов
/ 26 июля 2011

У меня есть список деревьев (один из родителей и 4 дочерних), если я изменяю, в окне предупреждения о положении детей будет отображаться порядок.

например

у меня есть дети 1, 2, 3, 4, и если я перетащу 4-го ребенка и поставлю его в положение 2

предупреждение будет отображать порядок как 1, 4, 2, 3.

you cac see it as image

и ссылка jsfiddle: http://jsfiddle.net/thilakar/AXDQL/.

1 Ответ

1 голос
/ 26 июля 2011 
** mind reading mode on (please write question that are understandable withouth links **

Вы можете сделать (вы должны использовать функцию останова, в противном случае предупреждение срабатывает дважды): 

 $( ".droptrue" ).sortable({
    connectWith: "ul.mt",
    dropOnEmpty: true,
    stop: function(event, ui) {
        var order = ui.item.prevAll().length;
        alert(order);
        //$.post("updateDB.php", order, function(theResponse){
        //$("#contentRight").html(theResponse);
     //});                                                              
    }                                      
 });

скрипка здесь: http://jsfiddle.net/nicolapeluchetti/AXDQL/2/

РЕДАКТИРОВАТЬ - чтобы сделать то, что вы хотите, вы можете сделать это: 

var addPositions = function() {
    $('.droptrue').each(function() {
        var position = 1;
        $(this).children().each(function() {

            $(this).data('position', position);
            position++;
        });
    });
};
$(document).ready(function() {
    var treeList = "";
    treeList = "<ul id=\"createTree\" class=\"droptrue1\">";
    for (var key in jsonObj) {
        //alert("key: " + key + ", value: " + jsonObj[key])
        for (var skey in jsonObj[key]) {
            treeList += ("<li class=\"listTree\" id=\"asdf\">" + skey + "<ul class=\"droptrue mt\">");
            for (var sskey in jsonObj[key][skey]) {
                for (var ssskey in jsonObj[key][skey][sskey]) {
                    treeList += ("<li class=\"innerList\">" + jsonObj[key][skey][sskey][ssskey] + "</li>");
                }
            }
            treeList += "</ul></li>";
        }
    }
    treeList += "</ul>";
    $('#tree').append(treeList);
    addPositions();



    $(".droptrue").sortable({
        connectWith: "ul.mt",
        dropOnEmpty: true,
        stop: function(event, ui) {
            var order = [];
            ui.item.closest('ul').children('li').each(function() {
                order.push($(this).data('position'));
                });
            alert(order.join(', '));
                //$.post("updateDB.php", order, function(theResponse){
            //$("#contentRight").html(theResponse);
            //});                                                              
            }
        });
    $("ul.droptrue1").sortable();
    });

Скрипка здесь: http://jsfiddle.net/nicolapeluchetti/AXDQL/6

...