Question

Can I add a parameter to an LI element so that I can then retrieve it within the droppable in jQuery

Currently I have :

drop: function(event, ui) { 
   var theText = ui.draggable.text();
}

But I need to access a parameter within the LI element ?

Answer 1

Try this example program. It may help you for your requirement

        $(document).ready(initialize);
        function initialize() 
        {
            $("#divFields li").draggable
            ({
                helper: "clone"
            });


            $("#divDroppedFields").droppable
            ({
                accept: "#divFields li",
                drop: function (event, ui)
                {
                    $(this).find('#txtMessageFields').append((ui.draggable.attr('data-value')));                        
                }
            });
        }


    <div id="divFields">
        <ul>
            <li data-value="data1">iPhone</li>
            <li data-value="data2">iPod</li>
            <li data-value="data3">iPad</li>
        </ul>
    </div>


  <div id="divDroppedFields" class="ui-widget-content">
        <textarea id="txtMessageFields" cols="50" rows="10"></textarea>
  </div>