jQuery की स्वत: पूर्ण ड्रॉपडाउन jQuery UI पर अपग्रेड करने के बाद प्रदर्शित नहीं हो रहा है 1.10.3

Question

रेल रूच पर मेरी रूबी में मैं jQuery UI 1.9.2 (jquery-ui-rails के माध्यम से) का उपयोग कर रहा था। मेरे पास एक मॉडल डायलॉग फॉर्म में एक स्वतः पूर्ण क्षेत्र था जो अजाक्स और जेसन का उपयोग करके ड्रॉपडाउन सुझाव बॉक्स को पॉप्युलेट कर रहा था। यह सही सुझाव दिखा रहा है, मुझे सही सुझाव दिखा रहा है।

बाद में मैंने jQuery UI 1.10.3 (bundle update का उपयोग करके) में अपग्रेड किया और अब स्वत: पूर्ण ड्रॉपडाउन सुझाव बॉक्स अब काम नहीं कर रहा है। यह जावास्क्रिप्ट कंसोल में कोई त्रुटि नहीं दिखाता है। वास्तव में यह दिखाता है कि जोसन वापस लौटाया गया है वह सही है।

मैं जे एस में स्वत: पूर्ण कार्य को फिर से लिखने मैन्युअल कॉल प्रदर्शन करने के लिए (स्वत: पूर्ण के source: $.ajax {} कॉल और अभी भी कुछ नहीं का उपयोग कर की कोशिश की है।

यह मेरे लिए सुझाव दिया गया था समस्या हो सकती है कि कि jQuery कुछ है कि jquery-ui-rails वजह से बदल मणि जवाब करने के लिए काम करना बंद करने के लिए, लेकिन उन्हें एक bug ticket जमा करने के बाद, यह पता चला है कि कि समस्या नहीं है

किसी भी मदद की सराहना की जाएगी

नोट:।।
mhu's answer सही है, और जहां संभव हो वहां आपको जेड-इंडेक्स के साथ छेड़छाड़ से बचना चाहिए (यही कारण है कि मैंने इसे सही के रूप में चिह्नित किया)। हालांकि मेरे मामले में (जहां स्वत: पूर्ण टेक्स्ट बॉक्स एक मॉडल संवाद में है) ड्रॉप डाउन केवल संवाद बॉक्स की चौड़ाई के भीतर प्रदर्शित किया जाएगा (यदि टेक्स्ट उससे बड़ा है, तो यह छिपा हुआ है और आप स्क्रॉलबार का उपयोग नहीं कर सकते)। जैसा कि मैं नहीं चाहता था, मैंने नीचे जो किया है मैंने my answer में वर्णित किया है और यह काम करता है। मैंने यह सुनिश्चित करने के लिए स्वयं को विभिन्न टिप्पणियां और नोट्स किए हैं कि यह अभी भी किसी भी jQueryUI अद्यतन के बाद काम करता है।

Answer 1

jQuery UI 1.10 का उपयोग करते समय, आपको ज़ेड-इंडेक्स (http://jqueryui.com/upgrade-guide/1.10/#removed-stack-option) के साथ गड़बड़ नहीं करना चाहिए। बस सुनिश्चित करें कि स्वत: पूर्ण तत्व सही डॉम ऑर्डर में है: स्वत: पूर्ण .insertAfter (संवाद।माता-पिता())

उदाहरण

var autoComplete, 
    dlg = $("#dialog"), 
    input = $("#input"); 

// initialize autocomplete 
input.autocomplete({ 
    ... 
}); 

// get reference to autocomplete element 
autoComplete = input.autocomplete("widget"); 

// init the dialog containing the input field 
dlg.dialog({ 
     ... 
}); 

// move the autocomplete element after the dialog in the DOM 
autoComplete.insertAfter(dlg.parent()); 

Answer 2

इस मुद्दे के लिए हर जगह खोज करने के बाद, मैंने पाया कि किसी को भी मेरी समस्या का समाधान नहीं हुआ क्योंकि मैं कोई त्रुटि संदेश नहीं दे सका और मैंने जो कोड दिखाया वह ध्वनि था। बाद कोई सुझाव मैं jQuery बदलाव पढ़ा (जो बेशक मैं नहीं था), मैं jQuery में बग के साथ ही वैकल्पिक हल मिल गया:

Added: Use .ui-front instead of .zIndex() for the suggestions menu. (7d5fe02) 

:,

jQuery UI 1.10.1 changelog में स्वत: पूर्ण खंड इसे पढ़ने के तहत

प्रदान किए गए लिंक के बाद और jQuery कोड फिक्स के माध्यम से देखकर, मुझे एक विचार दिया: मैंने अपनी स्वत: पूर्ण खोज की, और फिर मैंने मोडल डायलॉग को तरफ ले जाया! जब मैंने देखा कि ऑटोकॉप्लेट ड्रॉपडाउन सुझाव मेनू मॉडल डायलॉग के पीछे था।

मैं निम्नलिखित सीएसएस नियम जोड़कर इस तय:

ul.ui-autocomplete.ui-menu { 
    z-index: 1000; 
} 

मैं एक Bug ticket jQuery में सबमिट किया है, इसलिए मैं आशा करती हूं कि यह 1.10.4 से निपटा जाएगा तो यह है कि वैकल्पिक हल नहीं रह गया है जरूरत है।

मुझे आशा है कि इससे दूसरों की भी मदद मिलती है।