Définir nombre radio à cocher

Version imprimable

Voir 40 message(s) de cette discussion en une page

09/08/2013, 15h26
vik93

Voilà j'ai utilisé les PJ lol

:koi:
essayes de faire tourner ce code

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>[...]</title>
<script>
function checkBoxes() {
  var selectNumberItem = document.getElementById("nombre");
  var valeurNbreselectionne = selectNumberItem.value;
  var nbCheckBoxes = valeurNbreselectionne;
  var allInputs = document.getElementsByTagName('input');
  for(i = 0, k=0; i < allInputs.length; i++) {
    if (allInputs[i].type == 'checkbox'){
      allInputs[i].checked = k++< nbCheckBoxes;
    }
  }
}
window.onload = function() {
  document.getElementById("checkButton").onclick = checkBoxes;
}
</script>
</head>
<body>
  <select name="nombre" id="nombre">
    <option value="1"> 1 </option>
    <option value="2"> 2 </option>
    <option value="3"> 3 </option>
    <option value="4">4 </option>
    <option value="100">100</option>
  </select>
  <button type="button" id="checkButton">Cocher</button>
  <form id="myForm" name="myForm">
    <input type="text" value="input parasite">
    <input type="checkbox" value="value1">
    <input type="checkbox" value="value2">
    <input type="checkbox" value="value3">
    <input type="checkbox" value="value4">
    <input type="checkbox" value="value5">
  </form>
</body>
</html>

09/08/2013, 15h49
vik93

Je viens de le test sur une page blanche, ça fonctionne très bien :?
09/08/2013, 16h00
NoSmoking

Versifie qu'il n'y a pas de conflit avec EXTJS que tu utilises visiblement, sinon, et se serait dommage, utilise la bonne vielle méthode du inline :calim2:

Code:

<button type="button" id="checkButton" onclick="checkBoxes()">Select</button>
09/08/2013, 16h08
vik93

C'est quoi cette méthode de inline ? 8O

En fait j'utilise une application existante (GLPI). Je suis en train d'apporter des modifications dans le but de l'améliorer. Ce javascript devrait fonctionner, c'est très bizarre....

Extjs je ne connais pas du tout, je ne sais pas comment faire pour connaitre les conflits....

Quelle est la méthode inline ?
09/08/2013, 17h21
NoSmoking

Citation:

Quelle est la méthode inline ?

c'est mettre le code javascript directement dans la balise comme indiqué dans le dernier exemple

Citation:

<button type="button" id="checkButton" onclick="checkBoxes()">Select</button>

Citation:

Extjs je ne connais pas du tout, je ne sais pas comment faire pour connaitre les conflits....

pourtant les fichier JS sont insérer dans ton code, voir ta 1st capture line 16 et 17..

Pour info, document.querySelectorAll est maintenant largement supporté (même par IE8)

Code:

1
2
3
4
5
6
7
function checkBoxes() {
  var nbToCheck = document.getElementById("nombre").value;
  var boxes = document.querySelectorAll('input[type=checkbox]');
  for(i = 0; i < Math.min(boxes.length, nbToCheck ); i++) {
     boxes[i].checked = true;
  }
}

12/08/2013, 10h02
vik93

Bonjour,

J'ai tout essayé, mais j'ai toujours cette erreur :

Citation:

Uncaught TypeError: 'Cannot call method 'addEventListener' of null

Comme je l'ai dit plus haut, je récupère une application existante (qui est déjà implémentée), où j'apporte des modifications (notamment le JavaScript ici pour mon cas).

Je vais essayer d'étudier ExtJS (en espérant que ça ne me prenne pas beaucoup de temps :s).

Bonjour à tous !

Donc après une vingtaine de jours, toujours le même problème.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function checkBoxes() {
 var selectNumberItem = document.getElementById("nombre");
 var valeurNbreselectionne = selectNumberItem.options[selectNumberItem.selectedIndex].value;
 var nbCheckBoxes = valeurNbreselectionne;
 
 var allInputs = document.getElementsByTagName('input');
 
 for (i = 0; i < allInputs.length; i++) {
    if (allInputs[i].type == 'checkbox') {
      allInputs[i].checked = false;
    }
  }
 
 
  for (i = 0; i < allInputs.length && i < nbCheckBoxes; i++) {
    if (allInputs[i].type == 'checkbox') {
      allInputs[i].checked = true;
    }
  }
}
 
window.onload = function() {
 
  document.getElementById("checkButton").addEventListener("click", checkBoxes, false);
}

Je pense qu'il ne comprends pas "window.onload = function()".

Est ce possible de faire en sorte de le mettre dans le fonction checkboxes du dessus ? De façon à n'avoir qu'une seule fonction JS ? (j'espère avoir été clair).

En vous remerciant d'avance.

24/08/2013, 12h59
SylvainPV

Il n'y a aucune raison que window.onload ne fonctionne pas. Si l'erreur est toujours la même, alors ça montre clairement que l'élément avec un ID checkButton n'est pas trouvé dans le document. La première chose à regarder est donc le HTML, qu'ici nous n'avons pas.
26/08/2013, 10h04
vik93

Bonjour, et merci pour ta réponse !

En fait le code est dans les images juste au dessus (1ere page).

C'est le code du code source, et l'id est bien présent....

Je ne comprends pas ce qui se passe...

En vous remerciant d'avance

Voir 40 message(s) de cette discussion en une page