Question

I have two lists , one is draggale and other is sortable. When i move item from draggable to sortable items recives span and in span X mark . But the problem is that when i sort items later in sortable item recives x one more time . Then i have something like Item 1 XX and again every time u sort new x ( or drag ).

How can i fix this ?

$(function() {
 $( ".draggable" ).draggable({ 
    helper: "clone", 
    connectToSortable: ".sortable" 
  });
 $(".sortable").sortable({
        stop: function(event, ui) {
            ui.item.html(ui.item.text()+'<span class="remove">X</span>');
        }
 });
});

Answer 1

Check that there’s no span.remove inside the item?

$(function() {
    $( ".draggable" ).draggable({ 
        helper: "clone", 
        connectToSortable: ".sortable" 
    });
    $(".sortable").sortable({
        stop: function(event, ui) {
            if(!ui.item.find('span.remove').length) {
                ui.item.html(ui.item.text()+'<span class="remove">X</span>');
            }
        }
    });
});