2010-01-27 14 views
10

मानक व्यवहार में http://jqueryui.com/demos/sortable/ पर प्रदर्शित किया गया जब आप किसी आइटम को सूची में खींचते हैं तो प्लेसहोल्डर तत्व प्रदर्शित होता है जहां आइटम छोड़ा जाएगा।jquery UI sortable: ड्रॉप तक मूल दृश्य को कैसे छोड़ें?

हालांकि, आइटम का मूल स्थान गिराया जाना संकेत नहीं है।

मैं ड्रॉप जब तक मूल स्थान दिखाई छोड़ने के लिए है, ताकि विज़ुअल फ़ीडबैक तरह से मूल "अर्द्ध पारदर्शी क्लोन" पर http://jqueryui.com/demos/draggable/#visual-feedback

है दर्शाया विकल्प के लिए जगह में छोड़ दिया जाता है के अनुरूप है चाहते हैं क्रमबद्ध के साथ मैं ऐसा कर सकता हूं?

धन्यवाद!

उत्तर

12

तो एक दृष्टिकोण काम करने के लिए (सोचा था कि यह निश्चित रूप से एक हैक है) लगता है कि विकल्प

start: function (e, ui) { ui.item.show();}

जो स्वचालित रूप से छिपा मूल (ui.item) unhides पारित करने के लिए है।

और, आमतौर पर, आइटम को संशोधित करने के लिए start फ़ंक्शन का उपयोग कर सकते हैं।

+0

धन्यवाद। इससे मुझे –

+0

में मदद मिली लेकिन यह – Gino

+0

नाइस पर गायब हो गया। मैंने शुरुआत में कक्षा को जोड़ने और इसे रोकने पर भी समाप्त कर दिया। मैं फिर सीएसएस वर्ग की अस्पष्टता सेट करता हूं। मैंने पाया कि यह मदद करता है कि कौन सा मूल आइटम था। – RevNoah

0

विकल्प helper: 'clone' आपके मूल आइटम को जगह में छोड़ देगा, जबकि एक नया डीओएम तत्व बनाते हैं जो वास्तव में माउस द्वारा खींचा जाता है। (इसके अतिरिक्त, आप सहायक पर "अर्ध-पारदर्शी" प्रभाव बनाने के लिए opacity: 0.7 विकल्प का उपयोग करें।)

मुझे यकीन नहीं है कि आपको इसकी आवश्यकता होगी, लेकिन यदि क्लोन का उपयोग करना स्वचालित रूप से आइटम को नहीं हटाता है सूची से, आप DOM से पूरी तरह से निकाले गए आइटम को हटाने के लिए remove ईवेंट का उपयोग कर सकते हैं।

+2

तो, यही है कि मैंने सोचा था कि 'क्लोन' के साथ होना चाहिए - लेकिन जब मैं सहायक सेट करता हूं: 'क्लोन' मूल अभी भी असफल हो जाता है। तो शायद मुझे पूछना चाहिए: मैं क्या खो सकता हूं? – brahn

+0

इसे और अधिक ध्यान से देखते हुए, 'क्लोन' के साथ आइटम अभी भी डोम में दिखाई देता है। लेकिन यह प्रदर्शित नहीं होता है। मैंने उदाहरण को संशोधित किया है जो 'सहायक:' क्लोन 'विकल्प का उपयोग करने के लिए jquery-ui पैकेज के साथ आता है, आप इसे यहां देख सकते हैं: http://brahn.sqprod.com/jq/sortable-example.html – brahn

+0

और, वास्तव में (फ़ायरबग के लिए धन्यवाद) अब यह स्पष्ट है कि (फिर भी, 'क्लोन' विकल्प के साथ भी) मूल को शैली को 'डिस्प्ले' सेट करने के माध्यम से छुपाया गया है: कोई भी नहीं – brahn