jQuery UI, draggable/sortable append problem

Я пытаюсь добавить html к элементу, который я успешно перетащил в отсортированный список, но он не работает. Я клонирую оригинальный элемент и пытаюсь добавить к ui.helper безрезультатно.jQuery UI, draggable/sortable append problem

Вот что я до сих пор:

<head> 
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script> 

<script type="text/javascript"> 
    $(function() { 
     $("#sortable3").sortable({ 
      revert: true, 
      receive: function(ev, ui) { 
       ui.item.append("Tsfsdfg"); 
       save_object(ui.item); 
      } 

     }); 

     $('li',"#sortable1").draggable({ 
      connectToSortable: '#sortable3', 
      helper: 'clone', 
      revert: 'invalid', 

     }); 

     function save_object($item) { 
      var the_id = $item.attr('id'); 
      $item.append("This is it"); 
      $item.slideUp(500,function(){ 
       $(this).remove(); 
      }); 




     } 


     $("#sortable1, #sortable3").disableSelection(); 
    }); 
    </script> 

</head> 

<body> 

<div class="demo"> 

<ul id="sortable1"> 
    <li id="mx-101" class="ui-state-default">Num 1 <img src="images/icon_alert.png" alt="" /> </li> 
    <li id="mx-102" class="ui-state-default">Num 2 <img src="images/icon_clock.png" alt="" /></li> 
    <li id="mx-103" class="ui-state-default">Num 3 <img src="images/icon_congrats.png" alt="" /></li> 
    <li id="mx-104" class="ui-state-default">Num 4 <img src="images/icon_delete.png" alt="" /></li> 
    <li id="mx-105" class="ui-state-default">Num 5 <img src="images/icon_add.png" alt="" /></li> 
</ul> 


<ul id="sortable3"> 
</ul> 

<br clear="both" /> 

</div><!-- End demo --> 



</body>

Я просто хочу, чтобы добавить какой-то значок «Отменить удаление» по данному вопросу, который тащили в правый список боковой, так что я отправить его обратно первоначальный список. Кажется, что ничего не добавляет к перетаскиваемому/клонированному элементу, только оригиналу, и я избавляюсь от этого.

Любые идеи о том, как выполнить эту функцию? Должен ли я просто пойти с «droppable» в правом списке? Я хочу, чтобы этот правый список был отсортирован.

Благодаря

источник

2010-05-04 mmundiff

Это то, что я использовал в прошлом:

function itemreceived(event, ui) { 
    $(this).find("li.ui-state-highlight").removeClass("ui-state-highlight").addClass("ui-state-default"); 
    };

Просто в <li> s в #sortable1 отмеченного класса, который вы удалить, как только они были получены в #sortable3.

BTW - Вместо того чтобы устанавливать #sortable1 быть перетаскиваемым почему бы не использовать connectWith: как здесь: http://jqueryui.com/demos/sortable/#connect-lists

источник

2010-05-04 20:59:36

jQuery UI, draggable/sortable append problem

ответ

Смежные вопросы