/ / comment activer / désactiver une case à cocher en fonction de la sélection dans plusieurs cases - javascript, jquery, html, forms

Comment faire pour activer / désactiver une case à cocher en fonction de la sélection dans plusieurs boîtes - javascript, jquery, html, forms

J'ai une liste déroulante multi-sélection et une case à cocher dans un formulaire.

Je souhaite que la case à cocher ne soit activée que lorsque l’utilisateur sélectionne une valeur particulière dans la liste déroulante Sélection multiple.

Est-ce possible de le faire ... soit par javascript ou jQuery. J'utilise déjà jquery ailleurs.

Exemple: http://jsbin.com/ipomu

pour commencer, la case à cocher sera désactivée. il ne devrait être activé que lorsque l'utilisateur clique sur l'option 2

Réponses:

3 pour la réponse № 1

Un exemple. Il vous suffit d'ajouter les valeurs d'option pour lesquelles vous souhaitez activer la case à cocher dans l'objet tableau. Dans l'exemple suivant, j'ai activé la case à cocher en cliquant sur les options 2, 3,5 et 7.

<script type="text/javascript">
$(function(){
var arrVal = [ "2","3", "5", "7" ];

$("#combobox").change(function(){
var valToCheck = String($(this).val());

if ( jQuery.inArray(valToCheck,arrVal) == -1 )
{
$("#check").attr("disabled", "true");
}
else
{
$("#check").removeAttr ( "disabled" );
}
});
});
</script>
<select id="combobox" size="9" id="reasons" multiple="multiple">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
<option value="7">Option 7</option>
</select>

Démo de travail pour votre exemple.


1 pour la réponse № 2

J'ai mis à jour le lien jsbin que vous avez fourni avec le bon jQuery nécessaire pour obtenir l'effet souhaité.

http://jsbin.com/ipomu/2


0 pour la réponse № 3

Vous pouvez activer / désactiver un élément html via javascript avec:

document.getElementById("<the id of your checkbox here>").disabled = true;

Vous devez donc ajouter l’événement OnChange de votre liste déroulante de sélections multiples et ajouter une logique à certaines fonctions pour désactiver / activer votre case à cocher. Exemple:

<select onChange="myfunc(this)">

...

<script>
function myfunc(sel)
{
if (sel.selectedValue == "2")
document.getElementById("<the id of your checkbox here>").disabled = true;
}
</script>

0 pour la réponse № 4

Le plus simplement, avec Javascript direct, et pas de jQuery, vous pouvez ajouter ce qui suit onchange attribuer à la select element (en supposant que les deux éléments sont entourés de la même forme):

onchange="this.form["mycheck"].disabled = (this.value != 2)"

Si elles ne sont pas sous la même forme, ou si vous ne connaissez pas le nom de l’élément souhaité, ou si les éléments sont créés dynamiquement, le .disabled = (this.value != 2) sera la même, mais la méthode pour trouver la bonne case à cocher peut être différente.