web-dev-qa-db-fra.com

Définir l'option sélectionnée de la zone de sélection

Je souhaite définir une option précédemment sélectionnée à afficher au chargement de la page. Je l'ai essayé avec le code suivant:

$("#gate").val('Gateway 2');

avec

<select id="gate">
    <option value='null'>- choose -</option>
    <option value='gateway_1'>Gateway 1</option>
    <option value='gateway_2'>Gateway 2</option>
</select>

Mais ça ne marche pas. Des idées?

jqueryhtmljquery-selectorshtml-select
306
Artjom Zabelin

Cela devrait certainement fonctionner. Voici une démo . Assurez-vous d'avoir placé votre code dans une $(document).ready:

$(function() {
    $("#gate").val('gateway_2');
});
444
Darin Dimitrov
$(document).ready(function() {
    $("#gate option[value='Gateway 2']").prop('selected', true);
    // you need to specify id of combo to set right combo, if more than one combo
});
142
Zkoh

J'ai constaté que l'utilisation de la méthode jQuery .val () présentait un inconvénient majeur.

<select id="gate"></select>
$("#gate").val("Gateway 2");

Si cette zone de sélection (ou tout autre objet d'entrée) se trouve dans un formulaire et qu'un bouton de réinitialisation est utilisé dans le formulaire, lorsque vous cliquez sur le bouton de réinitialisation, la valeur définie est effacée et non réinitialisée à la valeur initiale comme vous le souhaitez.

Cela semble fonctionner le mieux pour moi.

Pour les cases de sélection 

<select id="gate"></select>
$("#gate option[value='Gateway 2']").attr("selected", true);

Pour les saisies de texte

<input type="text" id="gate" />
$("#gate").attr("value", "your desired value")

Pour les entrées textarea

<textarea id="gate"></textarea>
$("#gate").html("your desired value")

Pour les cases à cocher

<input type="checkbox" id="gate" />
$("#gate option[value='Gateway 2']").attr("checked", true);

Pour les boutons radio

<input type="radio" id="gate" value="this"/> or <input type="radio" id="gate" value="that"/>
$("#gate[value='this']").attr("checked", true);
15
Mike
  $("#form-field").val("5").trigger("change");
9
Mohd Bashir

Cela fonctionne bien. Voir ce violon: http://jsfiddle.net/kveAL/

Il est possible que vous deviez déclarer votre jQuery dans un gestionnaire $(document).ready()? 

Aussi, pourriez-vous avoir deux éléments qui ont le même identifiant?

6
James Wiseman

Ce serait une autre option:

$('.id_100 option[value=val2]').prop('selected', true);
5
Kent Aguilar

J'ai eu le même problème. 

Solution: ajouter une actualisation.

$("#gate").val('Gateway 2');
$("#gate").selectmenu('refresh');
4
Posted

Mon problème

get_courses(); //// To load the course list
$("#course").val(course); //// Setting default value of the list

J'ai eu le même problème . La seule différence par rapport à votre code est que je chargeais la zone de sélection via un appel ajax et que dès que l'appel ajax était exécuté, j'avais défini la valeur par défaut de la zone de sélection.

La solution

get_courses();
   setTimeout(function() {
     $("#course").val(course);
  }, 10);
1
Korah

Certains cas peuvent être 

$('#gate option[value='+data.Gateway2+']').attr('selected', true);
0
Hemil