Search code examples
jqueryjquery-uijquery-ui-draggablejquery-ui-droppable

Accessing text within <li> tag

I have a list of <li> items that are dragged using jQuerys drag/drop. I'd like to grab the text within the <li> tag just when the item is dropped, append the text to a global variable so that selected values can be submitted to a servlet.

To handle the functionality when the item is dropped I can use below jQuery callback : 

stop: function(event, ui) { 
    //update variable here
}

How can I grab the text value within the <li> tag and append it to a global variable ?

Thanks

Solution

  • You can use ui.draggable.text() in the drop event of droppable.

    drop: function(event, ui) { 
    myVar += ui.draggable.text();
}

    Or ui.helper.text() in the stop event of draggable.

    stop: function(event, ui) { 
    myVar += ui.helper.text();
}