J'essaie de remplir une liste déroulante avec un tableau à l'aide de jQuery.

Voici mon code:

<div class="form-group row">
    <label class="col-xl-3 col-lg-3 col-form-label">Numbers</label>
    <div class="col-lg-9 col-xl-6">
        <div class="form-inline">
            <select name="sabb" class="req form-control form-control-lg form-control-solid" id="age-range-2" autocomplete="off" required />
            </select>

            <label class="col-xl-1 col-lg-1 col-form-label">to</label>

            <select name="eabb" class="req form-control form-control-lg form-control-solid" id="second-2" autocomplete="off" required />
            </select>
        </div>
    </div>
</div>
                                          

Mon jQuery d'accompagnement est le suivant :

$(function() {
    var $select = $("#age-range-2");
    for (i = 18; i <= 60; i++) {
        $select.append($('<option></option>').val(i).html(i))
    }

    $("#age-range-2").change(function() {
        var val = parseInt($("#age-range-2").val());
        $("#second-2").html("");
        for (i = val + 1; i <= 60; i++) {
            $("#second-2").append("<option value='" + i + "'>" + i + "</option>");
        }
    });
});

J'essaie d'ajouter un tableau qui inclut des chiffres et des lettres au lieu d'une boucle for qui devrait ressembler à ceci : var numbers = [1K, 2K, 3K, 4K, 5K];

Voici un visuel:

enter image description here

0
mar 6 sept. 2020 à 17:01

1 réponse

Meilleure réponse

Je pense que c'est ce qu'il te faut :

for (i = 1; i <= 50; i++) {
     var o = new Option( i + "K", i);
      $(o).html( i + "K");
      $("#age-range-2").append(o);
}

for (i = 18; i <= 60; i++) {
     var o = new Option( i + "K", i);
      $(o).html( i + "K");
      $("#second-2").append(o);
}

Vous pouvez voir le résultat dans JSFiddle ici


Édité:

Si vous avez besoin d'un tableau prédéfini :

var numbers = [1,4,8,14,20,50,100];

$.each(numbers, function( index, value ) {
  var o = new Option( value + "K", value);
      $(o).html( value + "K");
      $("#age-range-2").append(o);
});
1
AnasSafi 6 sept. 2020 à 14:40