web-dev-qa-db-fra.com

Vérifier si l'option est sélectionnée avec jQuery, sinon sélectionnez une valeur par défaut

Avec jQuery, comment vérifier si une option est sélectionnée dans un menu de sélection et, dans le cas contraire, attribuer l’une des options sélectionnées.

(La sélection est générée avec un labyrinthe de PHP fonctions dans une application dont je viens d'hériter. Il s'agit donc d'une solution rapide pour bien comprendre ce qui se passe :)

javascriptjqueryformsdomhtml-select
204
meleyal

Bien que je ne sois pas sûr de ce que vous voulez accomplir, ce code a fonctionné pour moi.

<select id="mySelect" multiple="multiple">
  <option value="1">First</option>
  <option value="2">Second</option>
  <option value="3">Third</option>
  <option value="4">Fourth</option>
</select>

<script type="text/javascript"> 
$(document).ready(function() {
  if (!$("#mySelect option:selected").length) {
    $("#mySelect option[value='3']").attr('selected', 'selected');
  }
});
</script>
265
Joe Lencioni

Pas besoin d'utiliser jQuery pour cela:

var foo = document.getElementById('yourSelect');
if (foo)
{
   if (foo.selectedIndex != null)
   {
       foo.selectedIndex = 0;
   } 
}
30
FlySwat

Cette question est ancienne et a de nombreux points de vue, je vais donc simplement vous présenter des éléments qui aideront certaines personnes, j'en suis sûr.

Pour vérifier si un élément sélectionné a des éléments sélectionnés:

if ($('#mySelect option:selected').length > 0) { alert('has a selected item'); }

ou pour vérifier si une sélection n'a rien sélectionné:

if ($('#mySelect option:selected').length == 0) { alert('nothing selected'); }

ou si vous êtes dans une boucle et que vous voulez vérifier si l'élément actuel est sélectionné:

$('#mySelect option').each(function() {
    if ($(this).is(':selected')) { .. }
});

pour vérifier si un élément n'est pas sélectionné en boucle:

$('#mySelect option').each(function() {
    if ($(this).not(':selected')) { .. }
});

Ce sont quelques-unes des façons de le faire. jQuery a de nombreuses façons différentes d’accomplir la même chose, vous devez donc choisir celle qui semble être la plus efficace.

13
Gavin

réponse de lencioni est ce que je recommanderais. Vous pouvez changer le sélecteur pour l'option ('#mySelect option:last') pour sélectionner l'option avec une valeur spécifique en utilisant "#mySelect option[value='yourDefaultValue']". Plus sur les sélecteurs .

Si vous travaillez beaucoup avec des listes de sélection sur le client, consultez ce plugin: http://www.texotela.co.uk/code/jquery/select/ . Jetez un oeil à la source si vous voulez voir plus d'exemples d'utilisation de listes de sélection.

12
Alexander Pendleton

Voici ma fonction changer l'option sélectionnée. Cela fonctionne pour jQuery 1.3.2

function selectOption(select_id, option_val) {
    $('#'+select_id+' option:selected').removeAttr('selected');
    $('#'+select_id+' option[value='+option_val+']').attr('selected','selected');   
}
9
sata
<script type="text/javascript"> 
$(document).ready(function() {
  if (!$("#mySelect option:selected").length)
   $("#mySelect").val( 3 );

});
</script>
7
Ram Prasad

Facile! La valeur par défaut devrait être la première option. Fait! Cela vous mènerait à un JavaScript discret, car JavaScript n'est pas nécessaire :)

JavaScript discret

3
Martin Labuschin

Je suis déjà tombé sur le plugin texotela mentionné, ce qui me permet de le résoudre comme ceci:

$(document).ready(function(){
    if ( $("#context").selectedValues() == false) {
    $("#context").selectOptions("71");
    }
});
3
meleyal

Regardez le selectedIndex de l'élément select. BTW, c'est une chose simple, pas du tout spécifique à JQuery.

2
Hank Gay

J'ai trouvé que c'était un script rapide qui fonctionnait ... Le résultat est attribué à une étiquette.

$(".Result").html($("option:selected").text());
2
Joel

Vous faites beaucoup trop pour la sélection. Il suffit de sélectionner par valeur:

$("#mySelect").val( 3 );
1
giagejoe

J'ai trouvé un bon moyen de vérifier si l'option est sélectionnée et de sélectionner une valeur par défaut quand ce n'est pas le cas.

    if(!$('#some_select option[selected="selected"]').val()) {
        //here code if it HAS NOT selected value
        //for exaple adding the first value as "placeholder"
        $('#some_select option:first-child').before('<option disabled selected>Wybierz:</option>');
    }

Si # some_select n'a pas choisi l'option par défaut, alors . Val () est non défini

1
Marcin Bąk
if (!$("#select").find("option:selected").length){
  //
}
1
Avinash Saini
$("option[value*='2']").attr('selected', 'selected');
// 2 for example, add * for every option
0
user420944

Si vous avez besoin de vérifier explicitement chaque option pour voir si l'une d'entre elles possède l'attribut "sélectionné", vous pouvez le faire. Sinon, en utilisant option:selected, vous obtiendrez la valeur de la première option par défaut.

var viewport_selected = false;      
$('#viewport option').each(function() {
    if ($(this).attr("selected") == "selected") {
        viewport_selected = true;
    }
});
0
zeman

Je cherchais simplement quelque chose de similaire et j'ai trouvé ceci:

$('.mySelect:not(:has(option[selected])) option[value="2"]').attr('selected', true);

Cela permet de rechercher tous les menus sélectionnés de la classe pour lesquels aucune option n'a déjà été sélectionnée et de sélectionner l'option par défaut ("2" dans ce cas).

J'ai essayé d'utiliser :selected au lieu de [selected], mais cela n'a pas fonctionné car quelque chose est toujours sélectionné, même si rien n'a l'attribut.

0
Steven Schoch

Changer événement sur la zone de sélection pour déclencher et une fois que cela se produit, il suffit alors de tirer l'attribut id de l'option sélectionnée: -

$("#type").change(function(){
  var id = $(this).find("option:selected").attr("id");

  switch (id){
    case "trade_buy_max":
      // do something here
      break;
  }
});
0
Akash Deep Singhal
$("#select_box_id").children()[1].selected

C'est une autre façon de vérifier si une option est sélectionnée ou non dans jQuery. Cela retournera un booléen (vrai ou faux).

[1] est l'index de l'option case à cocher

0
Taimoor Changaiz