jquery- चुने हुए ड्रॉपडाउन को अक्षम करें

Question

मेरे पास एक चयनित div है जिसे मैं शैली के लिए चुने हुए jquery प्लगइन का उपयोग कर रहा हूं और (सबसे विशेष रूप से, खोज) में सुविधाओं को जोड़ता हूं । Div कुछ इस तरह दिखता है,

 <select data-placeholder="add a foobar" id="foobar" style="width: 350px;">
 <option value=""></option>
 </select>

और मैं इस तरह चुना प्लगइन का उपयोग कर रहा हूँ,

 $('#foobar').chosen();

जबकि कुछ AJAX लोड हो रहा है, मैं पूरे <select>डिव को अक्षम करना चाहूंगा । शायद कुछ इस तरह के साथ,

 $('#foobar').disable()

या यह

 $('#foobar').prop('disabled', true)

मुझे लगता है कि आपको विचार समझ आ गया है।

इसे कैसे करना है इस पर कोई आइडिया? मैंने कई अलग-अलग चीजों की कोशिश की है, जैसे चीजों को निष्क्रिय करने के लिए jquery मुहावरों का उपयोग करना, यह अक्षम करना <select>कि बस अंतर्निहित चयन अक्षम करता है, इसके ऊपर चुना गया सामान नहीं। मैंने मैन्युअल रूप z-indexसे बॉक्स को ग्रे करने के लिए एक उच्च के साथ एक और div जोड़ने का सहारा लिया है , लेकिन मुझे लगता है कि यह बदसूरत और छोटी गाड़ी होने की संभावना है।

सहायता के लिए धन्यवाद!

Answer 1

आप केवल अपने को अक्षम कर रहे हैं select, लेकिन चुने हुए इसे divs, और spans, आदि के रूप में प्रस्तुत करता है, इसलिए अपने चयन को अक्षम करने के बाद आपको चयनित विजेट को भी अक्षम करने के लिए प्लगइन को अपडेट करने की आवश्यकता है। आप इस तरह से कोशिश कर सकते हैं:

$('#foobar').prop('disabled', true).trigger("liszt:updated");

//For non-older versions of chosen you would want to do:

$('#foobar').prop('disabled', true).trigger("chosen:updated");

मुझे यहां की जानकारी मिली

बेला

एक बार जब आप विजेट को अपडेट कर लेते हैं, तो यह प्लगइन पर क्लिक या अन्य घटनाओं को बंद कर देता है और इसकी अपारदर्शिता को 0.5 में बदल देता है। जैसे कि डिव के लिए कोई वास्तविक विकलांग अवस्था नहीं है।

Comments

ऐसा लगता है कि कोई टाइपो है liszt:updated, क्या यह `सूची: अद्यतन नहीं होना चाहिए?

— लैंक्सक्स

lisztसही था, लेकिन अब chosen:updatedइसे वैसे भी करने का उचित तरीका है।

— कालेब एंडरसन

सुझाव: आपको अपने उत्तर में पहली बार कोड के नवीनतम संस्करण को निर्दिष्ट करने की आवश्यकता हो सकती है क्योंकि कई उपयोगकर्ता नवीनतम संस्करण का उपयोग कर रहे होंगे। मैंने इसका उपयोग किया liszt:updatedऔर काम नहीं किया क्योंकि यह नए संस्करणों में काम नहीं कर रहा है।

— लकी

.trigger("chosen:updated");यह सक्रिय या निष्क्रिय करने का कार्य भी करता है, उदाहरण के लिए यदि आप इसे किसी फ़ंक्शन में फिर से कॉल करते हैं।

— अरिनास वी।

$ ('# फोब्बर ऑप्शन: नहीं (: चयनित)')। प्रोप ('डिसेबल', ट्रू) .trigger ("चुना: अपडेटेड"); चयनित आइटम को छोड़कर ड्रॉपबॉक्स में अन्य आइटम को अक्षम कर देगा।

— असद नईम

Answer 2

चुने हुए नवीनतम संस्करण में, liszt:updatedअब काम नहीं कर रहा है। आपको उपयोग करने की आवश्यकता है chosen:updated:

$(".chosen-select").attr('disabled', true).trigger("chosen:updated")

यहाँ एक JSFiddle है ।

Answer 3

पीएसएल सही था, लेकिन चुने जाने के बाद से अपडेट किया गया है।

इसे अक्षम करने के बाद रखें:

$("#your-select").trigger("chosen:updated");

Answer 4

$('#foobar').prop('disabled', true).trigger("chosen:updated");

यह सही काम करता है !!!! @chosen v1.3.0

Answer 5

आप यह कोशिश कर सकते हैं:

$("#foobar").prop('disabled',true).trigger("chosen:updated").chosen('destroy').chosen()

Answer 6

$("chosen_one").chosen({
  max_selected_options: -1
});

Answer 7

$(document).ready(function () {
    $("#foobar").chosen().on('chosen:showing_dropdown',function() {
            $('.chosen-select').attr('disabled', true).trigger('chosen:updated');
            $('.chosen-select').attr('disabled', false).trigger('chosen:updated');
            $('.search-choice-close').hide();
    });
    $('.search-choice-close').hide();
});