Как отключить перетаскивание после удаления предмета? - PullRequest
Новая
       7

Как отключить перетаскивание после удаления предмета?

0 голосов
/ 24 ноября 2018

Это то, что у меня есть.Прямо сейчас, когда перетаскиваемый элемент уронен, его все еще можно перемещать (перетаскивать) и перемещать.Я хочу отключить каждый перетаскиваемый элемент после его удаления.

Вот что у меня есть 

  $( function() {
    $(".drag").draggable({
    stack: ".drag",
    stop: function() {
      let next = $(this).data('index') + 1;
      $('div[data-index="' + next + '"]').show();
    }
  });
    $( ".droppable" ).droppable({
     tolerance: "touch",
      drop: function( event, ui ) {
        $( this )
          .addClass( "ui-state-highlight" )
          .find( "p" )
      }
    });
  } );

Пример моих перетаскиваемых предметов 

<div id="drag1" data-index="1" class="drag" style="left:10px;top:20px;background-color:orange">Draggable 1</div>

<div id="drag2" data-index="2" class="drag" style="left:10px;top:20px;background-color:lightblue; display: none;">Draggable 2</div>

<div id="drag3" data-index="3" class="drag" style="left:10px;top:20px;background-color:lightblue; display: none;">Draggable 3</div>

Спасибо за вашу помощь.

1 Ответ

0 голосов
/ 24 ноября 2018

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

ui.draggable.draggable ({disabled: true});

Js Fiddle Demo Here 

$( "#droppable" ).droppable({
 tolerance: "touch",
  drop: function( event, ui ) {
      //debugger;
      //var dragId = ui.draggable.attr("id");
      //$("#"+dragId).removeClass("drag"); // If you want to change the class
      ui.draggable.draggable({disabled: true}); // For revoking draggable functionality
    $( this )
      .addClass( "ui-state-highlight" )
      .find( "p" ).html("Done")
  }
});
...