jQuery के चयन 2 को चुनिंदा टैग का मूल्य मिलता है?


95

नमस्कार दोस्तों यह मेरा कोड है:

<select id='first'>
  <option value='1'> First  </option>
  <option value='2'> Second </option>
  <option value='3'> Three  </option>
</select>

यह मेरा चयन 2 कोड है:

$("#first").select2();

नीचे चयनित मूल्य प्राप्त करने के लिए कोड है।

$("#first").select2('val'); // It returns first,second,three.

यह एक पाठ की तरह लौट first,second,threeरहा है और मैं प्राप्त करना चाहता हूं 1,2,3
इसका मतलब है कि मुझे टेक्स्ट नहीं, बल्कि चयन बॉक्स के मूल्य की आवश्यकता है।


आप एक JSFiddle प्रदान कर सकते हैं? यह बहुत उपयोगी होगा।
आयनॉ बिज़ुआ

1
प्रश्न स्पष्ट नहीं है। वास्तव में आप क्या चाहते हैं?
हीरालाल

जवाबों:


148
$("#first").val(); // this will give you value of selected element. i.e. 1,2,3.

5
। $ ( "# पहले") वैल (); // यह 1,2,3 या $ ("# पहला") लौटाता है। select2 ('वैल'); // यह पहले, दूसरे, तीन पर वापस लौटा
खूंटी

। $ ( "# पहले") वैल (); 1,2,3 लौटाएगा (जो कभी चुना गया है) और क्या आप अधिक विवरण के लिए फ़ंक्शन select2 () में कोड पोस्ट कर सकते हैं।
सोमेश

वर्ग के नाम के बजाय आईडी नाम से चुने जाने के लिए, का उपयोग करें: $ ("प्रथम"))। वैल ()
रुई मार्टिन्स

@ रुईमार्टिन गलत। आईडी को "#" के साथ बुलाया जाता है और कक्षाओं को "" के साथ कहा जाता है, इसलिए आईडी से कॉल करने के लिए, आप $ ("प्रथम") का उपयोग करेंगे। वैल () और वर्ग के लिए आप $ ("प्रथम" का उपयोग करेंगे।) ) .यावल ()
सोर्स मैटर्स

58

चयन करने के लिए तत्व का उपयोग कर सकते हैं $('#first').val();

चयनित मूल्य का पाठ प्राप्त करने के लिए - $('#first :selected').text();

क्या आप कृपया अपना select2()फ़ंक्शन कोड पोस्ट कर सकते हैं


1
। $ ( "# पहले") वैल (); // यह 1,2,3 या $ ("# पहला") लौटाता है। select2 ('वैल'); // यह पहले, दूसरे, तीन पर वापस लौटा
खूंटी

यकीन नहीं हो रहा है, मैं आपके सवाल को समझ गया।
कृष आर

1
जब मैंने select2 प्लगइन का उपयोग किया था, तब मुझे $ ("# प्रथम") का उपयोग करके मूल्य मिलता है। val ()। यह कुछ भी नहीं है इसे खाली लौटें।
खूंटी

आप अपने प्लगइन के साथ बेला निर्वासन प्रदान कर सकते हैं?
कृष R

1
मुझे $('#first :selected').text();दूसरे विकल्प का उपयोग करना था जो सभी संभावित विकल्पों को वापस कर रहा था।
जेफ ब्लूमेल

35

$("#first").select2('data') नक्शे के रूप में सभी डेटा वापस कर देंगे


1
बहुत उपयोगी है अगर आपके पास Select2 ऑब्जेक्ट्स पर अतिरिक्त गुण हैं
जूता

9

यदि आप अजाक्स का उपयोग कर रहे हैं , तो आप चयन के बाद सही का अद्यतन मूल्य प्राप्त करना चाह सकते हैं ।

//Part 1

$(".element").select2(/*Your code*/)    

//Part 2 - continued 

$(".element").on("select2:select", function (e) { 
  var select_val = $(e.currentTarget).val();
  console.log(select_val)
});

क्रेडिट: स्टीवन-जॉनसन


नमस्ते, मुझे पता है कि कहाँ से currentTargetआता है? आपका कोई भी आईडी / नाम उदाहरण प्रश्न से संबंधित नहीं है। इसलिए मैं कहीं भी संबंधित नहीं हो सकता।
मास्टर्स

8

यह समाधान आपको चुनिंदा तत्व को भूलने की अनुमति देता है। मददगार जब आपके पास चुनिंदा तत्वों पर एक आईडी नहीं है।

$("#first").select2()
.on("select2:select", function (e) {
    var selected_element = $(e.currentTarget);
    var select_val = selected_element.val();
});


3

इसे इस्तेमाल करे :

$('#input_id :selected').val(); //for getting value from selected option
$('#input_id :selected').text(); //for getting text from selected option

@RishishKhunt यहां दिए गए जवाब न केवल आपके (सवाल पूछने वाले व्यक्ति) हैं, बल्कि इस पेज को देखने वाले अन्य लोगों के लिए भी हैं। और अधिक अलग-अलग समाधान यहां प्रस्तुत किए गए हैं, बेहतर विकल्प हर किसी के पास है, फिर से: न केवल आप :)
infografnet

हाँ, मुझे क्षमा करें। धन्यवाद, @infografnet और उत्तर पोस्ट करने के लिए बहुत बहुत फ़हमी इमानुद्दीन का शुक्रिया :)
Renish Khunt

2

देखिए यह फील
मूल रूप से, आप valueअपने option-tags के s प्राप्त करना चाहते हैं , लेकिन आप हमेशा अपने select-node का मान प्राप्त करने का प्रयास करते हैं $("#first").val()

इसलिए हमें विकल्प-टैग का चयन करना होगा और हम jQuery के चयनकर्ताओं का उपयोग करेंगे:

$("#first option").each(function() {
    console.log($(this).val());
});

$("#first option")प्रत्येक का चयन करता है optionजो आईडी के साथ तत्व का एक बच्चा है first


। $ ( "# पहले") वैल (); // यह 1,2,3 या $ ("# पहला") लौटाता है। select2 ('वैल'); // यह पहले, दूसरे, तीन पर वापस लौटा
खूंटी

लगता है जैसे मुझे आपका प्रश्न गलत लगा, तो कृपया स्पष्ट करें कि आप क्या हासिल करना चाहते हैं।
कीनोन

जब मैंने select2 प्लगइन का उपयोग किया था, तब मुझे $ ("# प्रथम") का उपयोग करके मूल्य मिलता है। val ()। यह कुछ भी नहीं है इसे खाली लौटें।
खूंटी

देखिए यह फील । मेरे लिए पूरी तरह से अच्छा काम करता है। (मैंने बाहरी संसाधनों के तहत select2.js जोड़े, हालांकि मैं यह नहीं बता सकता कि बक्से बदसूरत क्यों दिखते हैं)।
कीनोन

कुंजी यह थी कि आपने कहा था कि हम विकल्प टैग का मूल्य प्राप्त करना चाहते हैं!
डेरियस .V

2

उपरोक्त समाधान नवीनतम चयन 2 (4.0.13) के साथ मेरे लिए काम नहीं किया

JQuery के साथ आप प्रलेखन के अनुसार मान प्राप्त करने के लिए इस समाधान का उपयोग कर सकते हैं: https://select2.org/programmatic-control/retrieving-selections

$('#first').find(':selected').val();

0

अन्य उत्तर मेरे लिए काम नहीं कर रहे थे इसलिए मैंने समाधान विकसित किया:

मैंने आसान लक्ष्यीकरण के लिए वर्ग = "विकल्प-आइटम" के साथ विकल्प बनाया

HTML:

<select id="select-test">
<option value="5-val" id="first-id" class="option-item"> First option </option>
</select>

फिर प्रत्येक चयनित विकल्प के लिए मैंने कोई भी गुण प्रदर्शित नहीं किया

सीएसएस:

option:checked {
   display: none;
}

अब हम अपने चुने हुए विकल्प को खोजने के लिए अपने सिलेक्टबॉक्स में बदलाव जोड़ सकते हैं, जिसमें कोई भी गुण सरल : छिपी विशेषता द्वारा प्रदर्शित नहीं होता है

JQuery:

$('#select-test').change(function(){
//value 
    $('#select-test').find('.option-item:hidden').val();
//id
    $('#select-test').find('.option-item:hidden').attr('id');
//text
    $('#select-test').find('.option-item:hidden').text();
});

वर्किंग फिडल: https://jsfiddle.net/Friiz/2dk4003j/10/


हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.