J'utilise le prototype 1.6.0.1. J'essaie de sélectionner toutes les cases en cliquant sur un bouton. Ce code fonctionne dans IE 6, mais ne fonctionne pas dans Firefox 3. Qu'est-ce que je fais mal?Prototype sélectionner toutes les cases à cocher code fonctionne dans IE, mais pas Firefox
<input class="submit" type="button" value="check all" onclick="$(this.form).getInputs('checkbox').each(function (elem) {elem.checked = true;});" />
Ce que vous est de remplacer
$(this.form)
avec
$('MYFORMNAME')
?
La forme est le parent de l'entrée, donc cette forme ne devrait pas avoir de sens. Utilisez un sélecteur d'ID ou un parent.
Deuxième chose - déclarez cette js d'assigner une action sur le chargement de document, de cette façon est un peu brouillon, séparer js de html pour avoir une base de code propre et flexible.
En jQuery ce serait comme STH:
$(document).ready(function(){
$.('#submitId').click(function(){
// check the checkboxes
});
}
dans le prototype devrait être similaire.
Tous les éléments d'entrée ont un attribut this.form qui fait référence à la forme à laquelle ils appartiennent. –
J'ai créé une page très simple pour tester votre problème:
<html>
<head>
<script type="text/javascript" src="prototype-1.6.0.3.js" ></script>
</head>
<body>
<form>
<input type="checkbox" id="test1" /> Test 1<br/>
<input type="checkbox" id="test2" /> Test 2<br/>
<input type="checkbox" id="test3" /> Test 3<br/>
<input type="checkbox" id="test4" /> Test 4<br/>
<input class="submit" type="button" value="check all" onclick="$(this.form).getInputs('checkbox').each(function (elem) {elem.checked = true;});" />
</form>
</body>
</html>
& cela fonctionne bien pour moi dans Firefox 3.0.8 (ainsi que IE) ...
Je suis en désaccord avec le d'autres réponses ... this.form devrait être bien (obtient l'objet de forme du bouton de soumission, qui devrait alors vous permettre d'obtenir les cases à cocher par getInputs).
Quel est le problème réel? Rien ne se passe du tout? Si oui, la seule chose que je peux penser est, sont les cases à cocher dans le même formulaire que le bouton?
EDIT: Si votre code est effectivement le même que celui ci-dessus & sa ne fonctionne pas, le meilleur que je peux suggérer est que vous tournez votre onclick en fonction propper appel & puis utilisez firebug pour travailler qui ISN bits spécifique ne travaille pas. C'est à dire. rendre votre code ressembler à ceci:
<html>
<head>
<script type="text/javascript" src="prototype-1.6.0.3.js" ></script>
<script type="text/javascript" >
function checkAll(button) {
var form = $(button.form);
var inputs = form.getInputs('checkbox');
inputs.each(function (elem) {
elem.checked = true;
});
}
</script>
</head>
<body>
<form>
<input type="checkbox" /> Test 1<br/>
<input type="checkbox" /> Test 2<br/>
<input type="checkbox" /> Test 3<br/>
<input type="checkbox" /> Test 4<br/>
<input class="submit" type="button" value="check all" onclick="checkAll(this)" />
</form>
</body>
</html>
Ensuite, vous pouvez mettre des points de rupture dans la fonction & assurez-vous que « bouton », « entrées » « forme » et sont ce que vous attendez d'être et que le « élém 'dans chaque boucle est aussi.
Rien ne se passe du tout. Je l'ai essayé avec Safari, et encore rien ne se passe. Seul IE semble fonctionner.Le seul différent entre mon code et votre exemple est que je n'ai pas "id = test1" pour chaque case à cocher, en partie parce qu'il est généré dynamiquement. – Robert4Real
Bizarre ... seule bonne chose est que puisque le problème est dans firefox, au moins vous avez accès à firebug pour aider à dépister le problème (voir ma modification ci-dessus). – Alconja
Vous pouvez voir la solution dans ce lien: http://www.ryboe.com/2008/07/10/select-all-checkboxes-with-prototype-js.html
Si vous ne voulez pas cliquer, essayez ceci:
var form = $('options');
checkboxes = form.getInputs('checkbox');
checkboxes.each(function(e){ e.checked = 0 });
'this' devrait dans ce cas, reportez-vous au bouton soumettre, si Je suppose que 'this.form' n'est pas la bonne chose à utiliser. Mon intuition est = boj = est juste :) –
Je ne suis pas d'accord ... 'ceci' devrait être le bouton soumettre, donc 'this.form' devrait être le formulaire (en supposant que le bouton est à l'intérieur du formulaire), qui devrait contenir tout les entrées. – Alconja