Логика позади перетаскивания - PullRequest
Новая
       8

Логика позади перетаскивания

4 голосов
/ 28 апреля 2009

Мне интересно, как «как это работает» и «как это должно быть спроектировано и реализовано» в основной функциональности перетаскивания.

Я еще никогда не реализовывал такую ​​функциональность. Я планирую сделать это для одного из моих проектов, и у меня есть некоторые идеи о том, как его реализовать. Я хотел убедиться, что я на правильном пути, и вам, людям, скорее всего, есть, что сказать по этому вопросу тоже ...

Давайте представим, что у меня есть 5 элементов, перечисленных ниже и извлеченных из базы данных; 

<div id="1">this is content for 1</div>
<div id="2">this is content for 2</div>
<div id="3">this is content for 3</div>
<div id="4">this is content for 4</div>
<div id="5">this is content for 5</div>

так как это извлекается из базы данных, мы знаем, что в ней есть поле с именем "sequence" или "order", чтобы различать порядок, который мы собираемся вывести. Давайте также представим, что в настоящее время значения столбцов «sequence» совпадают с идентификаторами элементов div. итак: 1,2,3,4 и 5 соответственно.

Мой вопрос и мысли;

Если я перетащу div 4 и опущу его между 1 и 2; какие шаги с этого момента? Например:

1) определить идентификатор перетаскиваемого div (назовем это div-a )

2) определить идентификатор div, который div-a вставляется после (или до) в этом случае после и, следовательно, после div id 1 (назовем это div-b ) * * тысяча двадцать-два

3) Обновите последовательность div-a в дБ и установите для нее текущую последовательность div-b

после этого шага я все сбит с толку ... Считаю ли я все дивы и в соответствии с тем, в каком порядке делятся дивы, обновляю ли я соответственно БД? или я совершенно не прав и есть другой способ?

спасибо за ответы, но я знаю, что есть плагины и другие вещи, чтобы сделать это, но меня интересует только логическая часть ..

Ответы [ 3 ]

1 голос
/ 29 апреля 2009

http://jqueryui.com/demos/sortable/

    $("#col1").sortable({
        placeholder: "top",
        forcePlaceholderSize: true,
        revert: true, 
        update: function() { 
                $.ajax({
                     type: "GET",
                     url: "/request.php",
                     data: "data="+$(this).sortable("toArray")+"",
                     success: function(msg){ }
                        });         
             }
    });

toArray - последовательность ваших идентификаторов divs.

1 голос
/ 28 апреля 2009

Я считаю, что jquery дает вам возможность получить их заказ на основе идентификатора?

То, как я это делал, каждый раз, когда происходит какое-либо действие, захватывает текущий заказ и отправляет его обратно в мое приложение через ajax. Тогда мое приложение просто анализирует идентификаторы из того, что ему было дано, и обновляет стоимость заказа каждого элемента.

0 голосов
/ 29 апреля 2009

Если вы не делаете это для своего собственного образования, я бы посоветовал вам использовать jQueryUI.

Он имеет функцию перетаскивания, среди прочего, которая, вероятно, поможет вам с мелочью DaD, оставляя вам возможность реализовывать детали, специфичные для вашей проблемы.

...