jQuery select2 obtenir la valeur de la balise select?

Bonjour les amis c'est mon code:

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

Ceci est mon code select2:

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

Voici le code pour obtenir la valeur sélectionnée.

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

C'est retourner un texte comme first,second,threeet je veux obtenir 1,2,3.
Cela signifie que j'ai besoin de la valeur de la zone de sélection, pas du texte.

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

Pour obtenir l'élément Select, vous pouvez utiliser $('#first').val();

Pour obtenir le texte de la valeur sélectionnée - $('#first :selected').text();

Pouvez-vous s'il vous plaît poster votre select2()code de fonction

$("#first").select2('data') renverra toutes les données sous forme de carte

Si vous utilisez ajax , vous souhaiterez peut-être obtenir la valeur mise à jour de select juste après la sélection.

//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)
});

Crédits: Steven-Johnston

Cette solution vous permet d'oublier l'élément select. Utile lorsque vous n'avez pas d'identifiant sur certains éléments.

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

La réponse simple est:

$('#first').select2().val()

et vous pouvez également écrire de cette manière:

 $('#first').val()

Essaye ça :

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

Voyez ce violon .
En gros, vous voulez obtenir le values de vos option-tags, mais vous essayez toujours d'obtenir la valeur de votre select-node avec $("#first").val().

Nous devons donc sélectionner les balises d'options et nous utiliserons les sélecteurs jQuerys:

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

$("#first option")sélectionne tout optionce qui est un enfant de l'élément avec l'id first.

Les solutions ci-dessus ne fonctionnaient pas pour moi avec le dernier select2 (4.0.13)

Avec jQuery, vous pouvez utiliser cette solution pour récupérer la valeur selon la documentation: https://select2.org/programmatic-control/retrieving-selections

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

Les autres réponses ne fonctionnaient pas pour moi, j'ai donc développé une solution:

J'ai créé une option avec class = "option-item" pour un ciblage facile

HTML:

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

Ensuite, pour chaque option sélectionnée, j'ai ajouté la propriété display none

CSS:

option:checked {
   display: none;
}

Maintenant, nous pouvons ajouter modifications à notre SelectBox pour trouver l'option sélectionnée avec la propriété display none par simple : attribut caché

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();
});

Violon de travail: https://jsfiddle.net/Friiz/2dk4003j/10/

Solution :

var my_veriable = $('#your_select2_id').select2().val();
var my_last_veriable = my_veriable.toString();