JQuery живое перетаскиваемое / живое сбрасываемое? - PullRequest
Новая
       4

JQuery живое перетаскиваемое / живое сбрасываемое?

6 голосов
/ 10 июня 2010

В основном есть две таблицы: компании и посетители.В настоящее время можно перетаскивать посетителей в компании.Работает отлично.Как только возникает функция отбрасывания, существует два $ .post.Первый сохраняет перетаскивание в базу данных.Второй обновляет посетителей, потому что информация постоянно меняется.Проблема, однако, заключается в том, что, как только заканчивается второй $ .post, Firebug продолжает выдавать следующую ошибку: 

d(this).data("draggable") is null

, которая возникает в файле пользовательского интерфейса jQuery.На линии 56.

около 400 раз или около того.Так что в основном я ищу способ сделать live () с помощью draggable и droppable.

.draggables находятся в #visitors (ul).Понижения можно найти в #companies (таблица).

Спасибо! 

$(".draggable").draggable({
    revert:true
});
$(".droppable").droppable({
    drop: function(ev, ui) {
        $(this).text($(ui.draggable).text());

        $.post('planning/save_visit', {user_id: $(ui.draggable).attr('id'), company_id: $(this).attr('id'), period: $('ul.periods li.active').attr('id')});

        $.post('planning/' + $('ul.periods li.active').attr('id'), {visitors:true}, function(data){
            $('#visitors').html(data);
        });
    },
    hoverClass: 'drophover'
});

Ответы [ 2 ]

9 голосов
/ 11 июня 2010

При перезагрузке посетителей вы заменяете все перетаскиваемые элементы, когда вы делаете $('#visitors').html(data); - так, чтобы те, что были перетаскиваемыми ранее, удаляются и заменяются новыми элементами, которые нельзя перетаскивать. (я почти уверен, что вы понимаете это из-за упоминания .live(), так что это просто здесь для полноты)

Однако, вы точно знаете , когда изменяются элементы посетителя, поэтому вместо альтернативы .live() почему бы просто не сделать еще один запрос на перетаскиваемый эффект сразу после изменения. Возможно, будет безопаснее «уничтожить» старые перетаскиваемые объекты, прежде чем их заменять, но я не уверен, что это строго необходимо. 

$.post('planning/' + $('ul.periods li.active').attr('id'), {visitors:true}, function(data){      
    $(".draggable").draggable("destroy");
    $('#visitors').html(data); 
    $(".draggable").draggable({ revert:true }); 
});
7 голосов
/ 28 ноября 2011

1) Создать х элементов 

<div class='dropzone'></div>
<div class='droppableItem'></div>

2) Добавить слушателя ко всем Dropzones 

$(".dropzone").liveDroppable( { hoverClass:'drophover', accept:'.droppableItem' });

3) Определить пользовательскую функцию liveDroppable 

(function ($) {
   $.fn.liveDroppable = function (opts) {
      this.live("mouseenter", function() {
         if (!$(this).data("init")) {
            $(this).data("init", true).droppable(opts);
         }
      });
      return $();
   };
}(jQuery));

4) Всякий раз, когда вы программно добавляете новую зону сброса, просто звоните .. 

    $(".dropzone").mouseenter();


Результат: программно добавленные или «живые» дропзоны будут сбрасываться.

...