मैं jQuery के चुने हुए प्लगइन के साथ एक फॉर्म को कैसे रीसेट कर सकता हूं?

Question

मेरे पास एक selectफॉर्म में तत्वों का एक गुच्छा है, जिसके साथ मैं Jquery चुना प्लगइन का उपयोग कर रहा हूं । मैं फॉर्म को कैसे रीसेट कर सकता हूं? निम्नलिखित काम नहीं करता है:

<input type="reset" />

Comments

आपको जैक ओ'नील के उत्तर के लिए अपना स्वीकृत उत्तर बदलना चाहिए। अन्य समाधान कोई और काम नहीं करते हैं।

— जेम्स

कृपया अपने स्वीकार किए गए ans को जैक ओ'नील उत्तरदाता में बदलें। क्योंकि नवीनतम संस्करण ट्रिगर अब कहा जाता है: अद्यतन

— शुभचिंतक

@ नाम और शुभचिंतक: ऐसा नहीं है कि जब भी कोई प्लगइन अपडेट करेगा तो हम इस साइट पर सभी प्रश्नों के उत्तर बदल देंगे। उस समय समाधान सही था। रॉबर्टवडेल ने उत्तर पर एक टिप्पणी रखी, मेरा मानना ​​है कि यह जाने का रास्ता है।

— 13

Answer 1

आपको फ़ील्ड के मूल्य को रीसेट करने की आवश्यकता होगी, फिर liszt:updatedइसे अपडेट करने के लिए इनपुट पर ईवेंट को ट्रिगर करें, ive ने यहां काम करने वाले उदाहरण के साथ एक बेला बनाया।

http://jsfiddle.net/VSpa3/3/

$(".chzn-select").chosen();
$('a').click(function(){
    $(".chzn-select").val('').trigger("liszt:updated");
});​

चुने हुए v1.0 के रिलीज के बाद से ट्रिगर को अब 'चुना: अपडेटेड' कहा जाता है। इस नए संस्करण का उपयोग करने वाले को अपडेट का उपयोग करके ट्रिगर करना होगा

$(".chosen-select").val('').trigger("chosen:updated");

Comments

अच्छा उत्तर! चुना के नवीनतम संस्करण के साथ, यह "(" चुना गया: अद्यतन किया गया ") होना चाहिए

— रॉबर्ट वाडेल

बहुत बढ़िया जवाब! लेकिन क्या मूल प्लेसहोल्डर को फिर से रीसेट करना और दिखाना संभव है?

— Niels Sønderbæk 15

अभी भी काम नहीं कर रहा है। मैं गतिशील रूप से Ajax कॉल्स (jQuery लोड () विधि) के माध्यम से अपने चयन को बदल रहा हूं। फिर एक नया चुना गया जारी ()। ट्रिगर ("चुना: अद्यतन"); और काम नहीं करता है। चुनी गई खोज अभी भी नए चयन पर काम नहीं करती है।

— मार्को मार्सला

'मल्टीपल: ट्रू' सेलेक्ट फ़ील्ड के लिए इसका उपयोग करते समय, यह प्लेसहोल्डर को भी हटा देता है। क्या आप समाशोधन के बाद प्लेसहोल्डर को बनाए रखने का एक तरीका जानते हैं?

— डेविड बसला

आह मुझे लगता है कि मैं इसे मिल गया ... $selectField.val([]).trigger('chosen:updated')लगता है कि चाल

— डेविड बसला

Answer 2

चुने हुए v1.0 के रिलीज के बाद से ट्रिगर को अब 'चुना: अपडेटेड' कहा जाता है। इस नए संस्करण का उपयोग करने वाले को अपडेट का उपयोग करके ट्रिगर करना होगा

$(".chosen-select").val('').trigger("chosen:updated");

Comments

परिवर्तनों के कारण यह सही उत्तर होना चाहिए। अन्य समाधानों में से कोई भी मुझे सही ढंग से काम नहीं मिला। धन्यवाद!

— जेम्स

लेकिन काम नहीं! यदि चयन एक ही आईडी / नाम के साथ एक अन्य चयन (jQuery लोड () विधि) के साथ डायनामिक रूप से बदल दिया जाता है, तो खोज नए चयन पर काम करना बंद कर देती है। नया चयन करने के लिए .chosen () को कॉल करने के लिए .chosen ('नष्ट'), totrigger ("चुना गया: अपडेट किया गया"), और इनमें से संयोजन करने की कोशिश की।

— मार्को मार्सला

Answer 3

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

$('select').chosen('destroy');  

$('select').prop("selectedIndex", -1);   
$('select').chosen();

Answer 4

स्वाभाविक रूप से काम करने के लिए इसे रीसेट करने के लिए:

$("input[type='reset'], button[type='reset']").click(function(e){
    e.preventDefault();

    var form = $(this).closest('form').get(0);
    form.reset();

    $(form).find('select').each(function(i, v) {
        $(v).trigger('chosen:updated');
    });
}

Comments

Form.reset () का उपयोग करना और फिर चुना हुआ ट्रिगर करना: अपडेट विशेष रूप से सबसे अच्छा समाधान है यदि आप फॉर्म को प्रस्तुत करना चाहते हैं क्योंकि यह मूल रूप से प्रदर्शित किया गया था। सेटिंग .val ('') डिफ़ॉल्ट मानों के लिए फॉर्म वापस नहीं करता है।

— बस सादा हाई

यह काम कर रहा है। कंघी करने के लिए मैन्युअल रूप से कॉम्बोक्स को चुनें (चयन करें) याद रखें।

— मार्को मार्सला

Answer 5

$("#Your_id").trigger("chosen:updated");

इसने मेरे लिए काम किया

Answer 6

अधिक परेशानी मुक्त दृष्टिकोण के लिए ... अपने इनपुट को <form>टैग के अंदर मान लेना :

<form>
    <!-- your selects go here and any other input fields -->
    <input type="reset" value="Reset"> 
</form>

क्या यही मुझे करना होगा:

$("input[type='reset'], button[type='reset']").click(function(e){
      setTimeout(function(){ $("select").trigger("chosen:updated"); }, 50);
});

देखें यहाँ बेला ।

Comments

@MarcoMarsala अगर आप फिडेल को देखते हैं, तो यह काम करता है। आपका कोड फिडेल से कैसे अलग है?

— प्राग्रामर

मैंने 1.2.0 पर अपडेट किया और सभी ने बिना किसी परेशानी के काम करना शुरू कर दिया। मुझे सेटटाइमआउट की भी आवश्यकता नहीं थी। संभवतः 1.12 में एक बग था

— मार्को मार्सला

Answer 7

पिछले विकल्पों में से कोई भी मेरे लिए काम नहीं करता है। मुझे इसे पुराने स्कूल की तरह करना था, यहाँ तक कि कुछ देशी जावास्क्रिप्ट का उपयोग करना, यहाँ कोड है:

$('#dllSample option').each(function(){
     $(this)[0].selected = false;   
});
$("#dllSample").trigger("chosen:updated");

Answer 8

यहां किसी भी जवाब ने मेरे लिए काम नहीं किया। कई विशेषताओं के साथ चुने हुए का उपयोग कर Im। सामान्य सबमिट फ़ॉर्म बटन या तो चाल नहीं चला। तो मैं बस क्लिक पर यह एक समारोह था।

//Gets the selected values
var selected = [];
    for (var option of document.getElementById('mySelect').options) {
        if (option.selected) {
            selected.push(option.value);
        }

    }

//Resets the form
document.getElementById('form1').reset();

//Chosen values doesnt get reset, so we do this manually
//Removes the values selected by clicking on the x icon
$link = $('a.search-choice-close');
            var i;
            for (i = 0; i < selected.length; i++) {
                $link[i].click();
            }

Answer 9

कभी-कभी आपको उस चयन को रीसेट करना होगा जिसे चुना गया है।

मैं यह करता हूँ

jQuery.fn.chosen_reset = function(n){
  $(this).chosen('destroy');
  $(this).prop('selectedIndex', 0);
  $(this).chosen(n)
}

और इस फ़ंक्शन को एक तर्क के रूप में विकल्पों के साथ इस तरह से कॉल करें

$('select').chosen_reset({width:'369px'});

Answer 10

JQuery में ऐसा कुछ काम करना चाहिए

<input name="Text1" id="something" type="text">

<input type="reset" id="reset_me"/>


$("#reset_me").click(function() { 
$("#something").val("");
});

Comments

$ j ('। chzn-select')। प्रत्येक (फंक्शन () {$ j (यह) .val ("")}); चुने हुए टैग को स्पष्ट नहीं करता है

— PH

@PH अगर आप हमारी मदद के लिए अपने कोड का एक उदाहरण दे सकते हैं

— MHowey

sottenad ने बस इसका उत्तर दिया, pls ऊपर अपने jsfiddle लिंक को देखें। अब मेरा कोड $ j ('। chzn-select') की तरह दिखता है। प्रत्येक (फंक्शन () {$ j (यह) .val ("")। ट्रिगर ("liszt: अपडेटेड");});

— PH 10