JQuery ne capture pas la valeur de la liste déroulante

Question

Je crée une interface API pour planifier la récupération des colis. L'API nécessite le nombre de packages, etc. Mon chef de projet a dit qu'il avait besoin du nombre de packages sous forme de liste déroulante. Maintenant, essayer d'obtenir la quantité de colis à partir du formulaire ne fonctionne pas, bien que cela fonctionne pour mes autres menus déroulants.

Mon code PHP pour générer une liste déroulante :

<select name="package_count" id="package_count" class="form-control form-inps">
                                <?php for ($i=1; $i<26; $i++) {
                                    if ($i !== 1) {
                                        echo "<option value='${i}'>${i}</option>";
                                    } else {
                                        echo "<option selected='selected' value='${i}'>${i}</option>";
                                    }
                                } ?>
                            </select>

Code pour capturer les appels API :

info.package_count = $("#package_count").val();

Pour référence, voici le code que j'utilise pour générer la liste déroulante du statut du client :

<select id="state" name="state" class="form-control form-inps">
                            <?php $customerState = $customer_id->state;
                                foreach ($categories as $abbr=>$full) {
                                if ($abbr !== $customerState && strtolower($full) !== strtolower($customerState)) {
                                    echo "<option value='${abbr}'>${full}</option>";
                                } else {
                                    echo "<option value='${abbr}' selected='selected'>${full}</option>";
                                }
                            }?>
                        </select>

Et le code pour le capturer :

info.state = $("#state").val();

Bien que la structure semble la même, le pays sera pris en compte, mais pas la quantité du colis :

city: 
"REDACTED"
company: 
""
date: 
"2023-03-17"
earliest: 
"13:00"
latest: 
"17:00"
name: 
"REDACTED"
package_count: 
""
shipping_direction: 
undefined
shipping_provider: 
undefined
state: 
"REDACTED"
street: 
"REDACTED"
street2: 
""
zip: 
"REDACTED"

Des idées sur la raison pour laquelle l'état fonctionne mais pas le nombre de packages ?

Answer 1

Vous choisissez la mauvaise méthode en essayant de parcourir plusieurs options

|| echo "${i}";

C'est également la valeur finale comme valeur finale par défaut sélectionnée

Essayez ceci

$("#package_count").change(function(){
 var val= $("#package_count option:selected").val();
  $('#result').html(val);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="package_count" id="package_count" class="form-control form-inps">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>

  </select>
  
  <p id="result" style="color:red;font-size:14px"></p>