jQuery यूआई sortable: कैसे मैं "प्लेसहोल्डर" वस्तु की उपस्थिति को बदल सकते हैं?

Question

http://jqueryui.com/demos/sortable/#placeholder प्लेसहोल्डर में दिए गए उदाहरण में नारंगी बॉक्स प्रकट होता है कि जब आप किसी भी आइटम को खींचें है।

यह तत्व placeholder विकल्प का उपयोग फेरबदल किया जा सकता है - लेकिन यह केवल आप तत्व के वर्ग को यहां बताए गए संशोधित करने देता है: http://jqueryui.com/demos/sortable/#options

मैं और अधिक इस तत्व को अनुकूलित करने, उदा चाहते हैं एक ही तरीके से placeholder विकल्प है कि एक helper विकल्प के लिए एक समारोह की आपूर्ति कर सकते करने के लिए एक समारोह की आपूर्ति करके।

क्या मैं यह करने के लिए बदलने के लिए की आवश्यकता होगी (जैसे में sortable.js)?

Answer 1

ui.sortable.js के लिए स्रोत (1.7.2), तो आपको धोखा और एक element समारोह के साथ एक वस्तु और एक update कार्य करने के लिए सेट कर सकते हैं placeholder को देखते हुए। element समारोह (आप अगर आप को देखने के लिए क्या डिफ़ॉल्ट कार्यान्वयन करता चाहते sortable अंदर _createPlaceholder समारोह की जाँच कर सकते हैं) प्लेसहोल्डर डोम वस्तु वापस जाने के लिए प्रयोग किया जाता है और update समारोह आप सही इसके आकार की तरह काम करने के लिए अनुमति देता है।

उदाहरण के लिए, निम्नलिखित सूची आइटम शब्द के साथ परीक्षण के अंदर अपने प्लेसहोल्डर के रूप में पैदा करेगा (ध्यान दें कि यह रिटर्न वास्तविक डोम वस्तु ([0]) और नहीं jQuery वस्तु ही):

$("#sortable").sortable({ 
    placeholder: { 
     element: function(currentItem) { 
      return $("<li><em>test</em></li>")[0]; 
     }, 
     update: function(container, p) { 
      return; 
     } 
    } 
}); 

यदि मैं सही ढंग से स्रोत पढ़ रहा हूं, तो element फ़ंक्शन वर्तमान आइटम (jQuery ऑब्जेक्ट) और this को पारित किया जाना चाहिए sortable स्वयं (यानी $("#sortable") इस उदाहरण में) को इंगित करना चाहिए। update में आपको "कंटेनर" पास किया गया है जो ऑब्जेक्ट है जिसमें सभी विकल्प हैं, & तत्व, आदि & placeholder स्वयं।

कृपया ध्यान दें कि यह एक गैर-दस्तावेजी हैक है, इसलिए यह स्पष्ट रूप से & jQuery यूआई के अगले संस्करण के साथ बदल सकते हैं असमर्थित होगा ... लेकिन यह अभी भी, आप के लिए काम का हो सकता है को देखते हुए आप संपादन के बारे में बात कर रहे थे वैसे भी ui.sortable.js।

उम्मीद है कि मदद करता है।

Answer 2

मुझे मिला एक और हैकिश दृष्टिकोण: कोई प्लेसहोल्डर तत्व को संशोधित करने के लिए start विकल्प का उपयोग कर सकता है, उदा।

$("#sortable").sortable({ 
    start: function (e, ui) { 
     // modify ui.placeholder however you like 
     ui.placeholder.html("I'm modifying the placeholder element!"); 
    } 
});