Implémentation Sélectionner et désélectionner (bascule) sur un SELECT TAG

La balise HTML SELECT actuelle fonctionne très bien pour moi, sauf pour une chose. Est-il possible d'activer la bascule sur l'élément actuel.Implémentation Sélectionner et désélectionner (bascule) sur un SELECT TAG

Si j'ai une sélection en cours, je voudrais cliquer à nouveau dessus et la "désélectionner". Cela ne fonctionne pas de cette façon maintenant, il maintient simplement la sélection actuelle "sélectionnée".

Il semble que j'ai besoin de connaître la sélection "précédente" avec la sélection "actuelle" et de comparer les 2 pour voir si j'ai besoin de "désélectionner" tout. Comment puis-je obtenir la sélection précédente, tout ce que je sais sur est "selectedIndex" qui est la sélection actuelle.

Y a-t-il un moyen?

Source

2009-08-06 Robert4Real

Est-ce une zone de sélection à sélection multiple? –

La solution indiquée fonctionnait-elle pour vous? – PortageMonkey

Pour ce faire, vous pouvez utiliser un peu de javascript comme suit. J'ai testé et il semble fonctionner comme vous l'avez demandé. Je suis verbeux pour la lisibilité, mais vous pouvez nettoyer une fois que vous l'avez travaillé pour vous.

<script language="JavaScript" type="text/javascript"> 
    function toggleSelectedValue() { 

     var selObj = document.getElementById('myList'); 
     var selIndex = selObj.selectedIndex; 
     var selValue = selObj.options[selIndex].value; 
     var prevSelValue = document.getElementById('trackSelectedValueHiddenField').value; 

     if (selValue == prevSelValue) { 

      //Delect "all" items 
      selObj.selectedIndex = -1; 
      document.getElementById('trackSelectedValueHiddenField').value = 0; 
     } 
     else {setSelectedValue();} 

    } 
    function setSelectedValue() 
    { 
     var selObj = document.getElementById('myList'); 
     var selIndex = selObj.selectedIndex; 
     document.getElementById('trackSelectedValueHiddenField').value = selObj.options[selIndex].value; 
    } 
    </script> 

</head> 
<body> 
<div id="wrapper"> 
    <div id="contentDiv" style="height:686px; border: solid 1px red;"> 
    <select multiple="multiple" id="myList" onclick="toggleSelectedValue()"> 
     <option value="1">Test</option> 
     <option value="2">Test</option> 
     <option value="3">Test</option> 
    </select> 
    <input type="hidden" id="trackSelectedValueHiddenField" value="0" /> 
    </div> 
</div> 
</body> 
</html>

Source

2009-08-07 03:49:53 PortageMonkey

Implémentation Sélectionner et désélectionner (bascule) sur un SELECT TAG

Répondre

Questions connexes