Comment limiter le nombre de choix sélectionnés dans une liste à sélection multiple en utilisant JavaScript?

J'ai n nombre de choix dans une boîte de sélection. Après que l'utilisateur sélectionne un ou plusieurs choix dans la boîte de sélection et soumette le formulaire, je dois vérifier que l'utilisateur n'a pas sélectionné plus de quatre choix.Comment limiter le nombre de choix sélectionnés dans une liste à sélection multiple en utilisant JavaScript?

J'ai essayé les éléments suivants:

function howMany() { 
    var selObj = document.getElementsByName('xid[]'); 

    var totalChecked = 0; 

    for (i = 0; i < selObj.options.length; i++) { 
     if (selObj.options[i].selected) { 
      totalChecked++; 
     } 
    } 
    if (totalChecked > 4) { 
     alert("You can't check more than 4 options"); 
     return false; 
    } 
    return true; 
}

Source

2009-07-20 Murugesh

Les sélections multiples sont une interface utilisateur assez désagréable avec laquelle beaucoup d'utilisateurs ont des difficultés. Je suggère de passer à un groupe de cases à cocher à la place. – Quentin

-1

si c'est un simple javascript .. c'est parti.

<pre> 
<html> 
    <script> 
     function howMany() { 
       var selObj = document.getElementById('paramid[]'); 
       var totalChecked = 0; 
       for (i = 0; i < selObj.options.length; i++) { 
        if (selObj.options[i].selected) { 
         totalChecked++; 
        } 
       } 
       alert(totalChecked); 
       if (totalChecked > 4) { 
        alert("You can't check more than 4 options"); 
        return false; 
       } 
       return true; 
     } 
     function testSubmit() { 
      return howMany(); 
     } 
    </script> 
    <body> 
     <form action="http://google.com"> 
      <select name="paramid[]" id="paramid[]" multiple> 
       <option>TEST1</option 
       <option>TEST2</option 
       <option>TEST3</option 
       <option>TEST4</option 
       <option>TEST5</option 
       <option>TEST6</option 
       <option>TEST7</option 
      </select> 
      <input type="submit" onclick="return testSubmit()" name="s" value=" How Many " id="s"/> 
     </form> 
    </body> 
</html> 
</pre>

Source

2009-07-20 13:22:14 kadalamittai

Votre mise en forme est cassée, et vous devriez probablement mentionner que cela nécessite la modification du code HTML (vous devez également le corriger afin qu'il ne nécessite pas la modification du HTML pour qu'il soit invalide, [et] ne sont pas autorisés dans les attributs id en HTML). – Quentin

L'indice est au nom du premier objet DOM que vous appelez: obtenir éléments ByName

Ceci retourne une liste de nœuds de tous les éléments avec ce prénom. Vous voulez supprimer le premier de la liste.

 var selObj = document.getElementsByName('paramid[]')[0];

Mieux encore, plutôt que de chercher dans l'ensemble du document:

 var selObj = myForm.elements['paramid[]']

& hellip; où myForm est une référence au formulaire (que vous pouvez obtenir à partir de this si vous avez utilisé cette fonction en tant que gestionnaire d'événement submit).

Source

2009-07-20 13:15:11 Quentin

Comment limiter le nombre de choix sélectionnés dans une liste à sélection multiple en utilisant JavaScript?

Répondre

Questions connexes