jQuery सॉर्ट करने योग्य - वर्तमान ड्रैग किए गए तत्व को कैसे प्राप्त करें

Question

मैं jqueryui sortable विजेट का उपयोग कर रहा हूं। मुझे वर्तमान ड्रैग किए गए तत्व के डेटा एट्रिब्यूज़ प्राप्त करने की आवश्यकता है। $ (यह) .डेटा ('attribute_name') यहां काम नहीं कर रहा है। मैंने कुछ अन्य तरीकों का भी प्रयास किया है, लेकिन सही परिणाम नहीं मिला है।

एचटीएमएल

<ul class="draggable-item" style="min-height:10px;"> 
    <li data-parent="31" data-id="81" class="ui-state-default">Label</li> 
    <li data-parent="31" data-id="86" class="ui-state-default">Max Value</li> 
    <li data-parent="31" data-id="83" class="ui-state-default">Unit</li> 
    <li data-parent="31" data-id="84" class="ui-state-default">Warning Level High</li> 
    <li data-parent="31" data-id="85" class="ui-state-default">Warning Level Low</li> 
</ul> 

जे एस

$(document).ready(function() { 
    $(".draggable-item").sortable({ 
    start: function(event, ui) { 
     //Here i need to get current dragged element's 'parent' attribue. 
     //console.log(ui.item[0].attributes); - Here i got the entire attribute values in an array. But the order of the array is different in browsers. 
    }, 
    }).disableSelection(); 
}); 

Answer 1

$(ui.item).data('attribute_name'); या $(event.currentTarget).data('attribute_name');

Answer 2

प्रयास करें $(this) का उपयोग करके आप तत्व है जिस पर sortable आरंभ नहीं हो जाता दे देंगे। Sortable Documentation देखें। वर्तमान क्रमबद्ध आइटम ui ऑब्जेक्ट में संग्रहीत है और आप इसे ui.item का उपयोग करके एक्सेस कर सकते हैं।

तो आप ui.item पर फ़ंक्शंस या विधियों को लागू करके वर्तमान सॉर्ट करने योग्य आइटम की किसी भी विशेषता तक पहुंच सकते हैं। $(ui.item) का उपयोग करना पसंद करें।

डेमो: http://jsfiddle.net/lotusgodkk/GCu2D/173/

$(document).ready(function() { 
    $(".draggable-item").sortable({ 
     start: function (event, ui) { 
      var attr = $(ui.item).attr('data-parent'); 
     }, 
    }).disableSelection(); 
}); 

Answer 3

मैं अद्यतन घटना में उपयोग कर रहा हूँ:

update: function (event, ui) { 

      var attr_id = ui.item.attr('data-id'); 
     }