jQuery - définition de la valeur sélectionnée d'un contrôle de sélection via sa description textuelle

J'ai un contrôle de sélection, et dans une variable javascript, j'ai une chaîne de texte.

En utilisant jQuery, je veux définir l'élément sélectionné du contrôle de sélection comme étant l'élément avec la description textuelle que j'ai (par opposition à la valeur, que je n'ai pas).

Je sais que le définir par valeur est assez trivial. par exemple

$("#my-select").val(myVal);

Mais je suis un peu perplexe sur le faire via la description textuelle. Je suppose qu'il doit y avoir un moyen de tirer la valeur de la description textuelle, mais mon cerveau est trop vendredi après-midi pour pouvoir le déterminer.

Sélectionner par description pour jQuery v1.6 +

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Versions de jQuery inférieures à 1,6 et supérieures ou égales à 1,4

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).attr('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Notez que bien que cette approche fonctionne dans les versions supérieures à 1,6 mais inférieures à 1,9, elle est déconseillée depuis 1.6. Cela ne fonctionnera pas dans jQuery 1.9+.

Versions précédentes

val() devrait gérer les deux cas.

$('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Je n'ai pas testé cela, mais cela pourrait fonctionner pour vous.

$("select#my-select option")
   .each(function() { this.selected = (this.text == myVal); });

Essayez ceci ... pour sélectionner l'option avec le texte myText

$("#my-Select option[text=" + myText +"]").prop("selected", true);

Je le fais de cette façon (jQuery 1.9.1)

$("#my-select").val("Dutch").change();

Remarque: n'oubliez pas le changement (), j'ai dû chercher trop longtemps à cause de cela :)

$("#myselect option:contains('YourTextHere')").val();

renverra la valeur de la première option contenant votre description textuelle. Testé cela et fonctionne.

Pour éviter toutes les complications de la version jQuery, je recommande honnêtement d'utiliser l'une de ces fonctions javascript vraiment simples ...

function setSelectByValue(eID,val)
{ //Loop through sequentially//
  var ele=document.getElementById(eID);
  for(var ii=0; ii<ele.length; ii++)
    if(ele.options[ii].value==val) { //Found!
      ele.options[ii].selected=true;
      return true;
    }
  return false;
}

function setSelectByText(eID,text)
{ //Loop through sequentially//
  var ele=document.getElementById(eID);
  for(var ii=0; ii<ele.length; ii++)
    if(ele.options[ii].text==text) { //Found!
      ele.options[ii].selected=true;
      return true;
    }
  return false;
}

Je sais que c'est un ancien article, mais je n'ai pas pu le sélectionner par texte en utilisant jQuery 1.10.3 et les solutions ci-dessus. J'ai fini par utiliser le code suivant (variation de la solution de spoulson):

      var textToSelect = "Hello World";

      $("#myDropDown option").each(function (a, b) {
            if ($(this).html() == textToSelect ) $(this).attr("selected", "selected");
        });

J'espère que cela aide quelqu'un.

Cette ligne a fonctionné:

$("#myDropDown option:contains(myText)").attr('selected', true);

 $("#Test").find("option:contains('two')").each(function(){
     if( $(this).text() == 'two' ) {
        $(this).attr("selected","selected");
     }
 });

L'instruction if fait une correspondance exacte avec "deux" et "deux trois" ne sera pas mise en correspondance

Le moyen le plus simple avec 1.7+ est:

$("#myDropDown option:text=" + myText +"").attr("selected", "selected"); 

1.9+

$("#myDropDown option:text=" + myText +"").prop("selected", "selected"); 

Testé et fonctionne.

Voici un moyen très simple. plz l'utiliser

$("#free").val("y").change();

jetez un oeil au plugin jquery selectedbox

selectOptions(value[, clear]): 

Sélectionnez les options par valeur, en utilisant une chaîne comme paramètre $("#myselect2").selectOptions("Value 1");ou une expression régulière $("#myselect2").selectOptions(/^val/i);.

Vous pouvez également effacer les options déjà sélectionnées: $("#myselect2").selectOptions("Value 2", true);

Juste sur une note secondaire. Ma valeur sélectionnée n'était pas définie. Et j'ai cherché partout sur le net. En fait, j'ai dû sélectionner une valeur après un rappel d'un service Web, car j'en obtenais des données.

$("#SelectMonth option[value=" + DataFromWebService + "]").attr('selected', 'selected'); 
$("#SelectMonth").selectmenu('refresh', true);

Le rafraîchissement du sélecteur était donc la seule chose qui me manquait.

J'ai trouvé qu'en utilisant attrvous vous retrouveriez avec plusieurs options sélectionnées lorsque vous ne vouliez pas - la solution est d'utiliser prop:

$("#myDropDown option:text=" + myText +"").prop("selected", "selected");

J'ai eu un problème avec les exemples ci-dessus, et le problème était dû au fait que mes valeurs de zone de sélection sont préremplies avec des chaînes de longueur fixe de 6 caractères, mais le paramètre transmis n'est pas de longueur fixe.

J'ai une fonction rpad qui remplira à droite une chaîne, à la longueur spécifiée et avec le caractère spécifié. Ainsi, après remplissage du paramètre, cela fonctionne.

$('#wsWorkCenter').val(rpad(wsWorkCenter, 6, ' '));


function rpad(pStr, pLen, pPadStr) {
if (pPadStr == '') {pPadStr == ' '};
while (pStr.length < pLen)
    pStr = pStr + pPadStr;
return pStr; 
} 

 $('#theYear').on('change', function () {
 FY = $(this).find('option:selected').text();
 $('#theFolders').each(function () {
     $('option:not(:contains(' + FY + '))', this).hide();
 });
 $('#theFolders').val(0);
});

$('#theYear').on('mousedown', function () {
 $('#theFolders option').show().find('option:contains("Select")', this).attr('selected', 'selected');
});

Cette réponse acceptée ne semble pas correcte, tandis que .val ('newValue') est correct pour la fonction, essayer de récupérer une sélection par son nom ne fonctionne pas pour moi, j'ai dû utiliser l'identifiant et le nom de classe pour obtenir mon élément

Voici une option facile. Définissez simplement votre option de liste, puis définissez son texte comme valeur sélectionnée:

$("#ddlScheduleFrequency option").selected(text("Select One..."));

Obtenez les enfants de la boîte de sélection; boucle à travers eux; lorsque vous avez trouvé celui que vous voulez, définissez-le comme l'option sélectionnée; renvoie false pour arrêter la boucle.