Recuperer le numero de ligne onKeyUp

Version imprimable

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

Bonjour
J'ai un tableau avec 6 colonnes et les lignes que je peux creer a l'aide d'un bouton ajouter produit.
Dans les 5 premiers colonnes j'ai des input type=text et dans la derniere j'ai une fonction qui me calcule un total qui es egal a la quantite* PU-remise

Le gros probleme est que si je decide d'ajouter 2 lignes sans remplir la colonne quantite PU et remise et je l'ajoute par la suite alors sa pose probleme puisque j'ai un compteur qui s'incremente a chaque fois que j'ajoute une ligne et j'affiche le total au numero de ce compteur
Il me faut donc un moyen pour afficher ce total ds la ligne courante c'est à dire ou je fais mes onKeyUp
Merci!
Je sais pas si c'est clair voila le 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
 
var compteur=0;
function AddRow(){
if (document.getElementById("qté_"+compteur).value!="")
{
	compteur++;
    var newRow = document.getElementById('table').insertRow(-1);
    var newCell = newRow.insertCell(0);
    newCell.innerHTML = ' <input type="text" name="ref_'+compteur+'"/>';
    newCell = newRow.insertCell(1);
    newCell.innerHTML = ' <input type="text" name="designation_'+compteur+'" />';
	 newCell = newRow.insertCell(2);
    newCell.innerHTML = ' <input type="text" name="qte_'+compteur+'" id="qté_'+compteur+'" onKeyup="check();" />';
	 newCell = newRow.insertCell(3);
    newCell.innerHTML = ' <input type="text" name="pu_'+compteur+'" id="prix_'+compteur+'"  onKeyup="check();"/>';
	 newCell = newRow.insertCell(4);
    newCell.innerHTML = ' <input type="text" name="remise_'+compteur+'" id="remis_'+compteur+'" onKeyup="check();" />';
	 newCell = newRow.insertCell(5);
 
    newCell.innerHTML = ' <span id="result_'+compteur+'"></span>';
	}
	else
	{
	window.alert("Veuillez saisir votre produit avant d'en ajouter un autre")
	}

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
 
  function check() {
 
          var qte = document.getElementById("qté_"+compteur).value;
 
         var prix = document.getElementById("prix_"+compteur).value;
 
         var remise = document.getElementById("remis_"+compteur).value;
 
          var result = document.getElementById("result_"+compteur);
 
 
 
          if(qte=='')
 
              qte = 0;
 
          if(prix == '')
 
              prix = 0;
 
			    if(remise == '')
 
              remise = 0;
 
          result.innerHTML = qte * prix-remise;
 
      }

Tout d'abord, mettre des accents pour les id, tu devrais oublier rapidement !
Ensuite, c'est dommage d'utiliser innerHTML pour créer tes input. Tu ferais mieux de passer par des méthodes plus propres, comme

Code:

document.createElement('input');

puis ajouter des propriétés.
Ceci aurait comme avantage de pouvoir transmettre comme propriété de tes input la valeur de compteur et donc de la récupérer par la suite, par exemple :
Code:

1 2 3 4 5 6 7 var input1 = document.createElement('input'); input1.value = 'Valeur'; ... input1.ref = compteur; input1.onkeyup = function(){ check(this.ref); }
puis :
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 function check(reference) { var qte = document.getElementById("qté_"+reference).value; var prix = document.getElementById("prix_"+reference).value; var remise = document.getElementById("remis_"+reference).value; var result = document.getElementById("result_"+reference); if(qte=='') qte = 0; if(prix == '') prix = 0; if(remise == '') remise = 0; result.innerHTML = qte * prix-remise; }

02/03/2009, 13h14
SpaceFrog

en passant

Code:

(this.parentNode.parentNode)

en paramètre de ta fonction tu recupère le tr (la ligne) et du coup tu recupères facileemnt les td enfants et leur contenu et le value du total
02/03/2009, 14h12
Argol

merci !
j'ai mis tout sa correctement et sa marche.
Petite orientation pour la suite svp
Comment puis je faire le total des totaux c'est à dire d'une colonne entière ?

Avec une boucle sur les id du total.

Code:

1
2
3
for(var i=0; i<compteur; i++){
    total += parseInt(document.getElementById('result_'+i).value,10);
}

02/03/2009, 15h08
Argol
Merci, mais la question est comment je fais pour lancer cette fonction aprés que la case du total d'une ligne soit calculé ?
en gros ce que je cherche c'est la méthode qui lance la fonction lorsque un champ est mis à jour!
Code:

1 2 3 4 input5.onkeyup = function(){ check(this.ref); total(); }
Code:

1 2 3 4 5 6 7 8 9 function total() { var total = document.getElementById("total"); for(var i=0; i<compteur; i++){ total += parseInt(document.getElementById('result_'+i).value,10); } }
j'ai essayer de faire calculer le total aprés chaque onkeyup
mais sa marche pas :(

Tu ne peux pas additionner des légumes et des fruits ! Ni des éléments HTML et des entiers ! ;)
Code:

1 2 3 4 5 6 7 8 9 10 function total() { var total = 0; for(var i=0; i<compteur; i++){ total += parseInt(document.getElementById('result_'+i).value,10); } document.getElementById("total").value = total; // Si ton élément total est un input document.getElementById("total").appendChild(document.createTextNode(total); // Si ton élément total est un span ou un div }
Bon, le createTextNode peut être remplacé par innerHTML, mais autant passer par les méthodes du DOM !

02/03/2009, 16h04
Argol

Merci j'ai effectivement un SPAN
et j'arrive a afficher quelque chose c'est deja sa
NaNNaNNaNNaNNaN
mais probleme not a number !

Code:

1
2
3
4
5
6
7
8
9
function total()
{
 var total = 0;
 
for(var i=0; i<compteur; i++){
    total += parseInt(document.getElementById('result_'+i).value.replace(/\D/g,''),10);
}
document.getElementById("total").appendChild(document.createTextNode(total));  // Si ton élément total est un span ou un div
}

J'avais oublié de fermer une parenthèse :aie:

02/03/2009, 16h13
Argol

oui, effectivement mais ce problème de parenthèse bloquer mon programme cela n'empêche que sa corrige pas le problème du NoN :s
02/03/2009, 16h14
Bovino

C'est bien pour ça que j'ai rajouté un replace() :roll:
02/03/2009, 16h22
Argol

ok, merci mais result_ est un span et il y a pas de .value dans les span :s
02/03/2009, 16h28
Matthieu2000

Code:

document.getElementById('result_'+i).innerHTML

le probleme c'est que il faut que le variable soit un entier parce que la sa m'affiche des suites de nombre :cry:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
function total()
{
 var total = 0;
 
for(var i=0; i<compteur; i++){
total += document.getElementById('result_'+i).innerHTML;
 
 
}
document.getElementById("total").appendChild(document.createTextNode(total));  // Si ton élément total est un span ou un div
//document.getElementById("total").innerHTML = monTotal;
 
}

sinon :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
function total()
{
 var total = 0;
 
for(var i=0; i<compteur; i++){
total += parseInt(document.getElementById('result_'+i).innerHTML,10);
 
 
}
document.getElementById("total").appendChild(document.createTextNode(total));  // Si ton élément total est un span ou un div
//document.getElementById("total").innerHTML = monTotal;
 
}

Resultat : NaN

02/03/2009, 16h38
SpaceFrog

Code:

total += document.getElementById('result_'+i).innerHTML*1;

ou

Code:

total += parseInteger(document.getElementById('result_'+i).innerHTML);

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
function total()
{
 var monTotal = 0;
 
for(var i=0; i<compteur; i++){
monTotal += parseInt(document.getElementById('result_'+i).innerHTML,10);
 
 
}
 
document.getElementById("total").innerHTML = monTotal;
 
}

voiloa qui fonctionne :=)

02/03/2009, 16h40
Bovino

Code:

total += parseInt(document.getElementById('result_'+i).innerHTML.replace(/\D/g,''),10);

Salut !
c'est encore moi :king:
lol
Bon je m'essaye a la suppression par ligne choisit maintenant
voila ma fonction :

Code:

1
2
3
4
5
6
function suppression(id)
{
Thetable = document.getElementById("table");
Thetr = document.getElementById(id);
 Thetable.removeChild(Thetr);
 }

J'essaye par un exemple simple et concret sans me perdre dans les compteurs pour commencer : ce qui me donne la table :

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
42
43
44
45
46
47
48
49
<table border="solid" align="center" id="table">
   <tr >
      <td>
      &nbsp&nbsp&nbsp&nbsp REF &nbsp&nbsp&nbsp&nbsp
       </td>
       <td>
    &nbsp&nbsp&nbsp&nbsp DESIGNATION &nbsp&nbsp&nbsp&nbsp            
       </td>
      <td>&nbsp&nbsp&nbsp&nbsp QTE &nbsp&nbsp&nbsp&nbsp
      </td>       
       <td>&nbsp&nbsp&nbsp&nbsp PU HT EN EURO &nbsp&nbsp&nbsp&nbsp
      </td>   
      <td>&nbsp&nbsp&nbsp&nbsp Remise &nbsp&nbsp&nbsp&nbsp
      </td>   
       <td>&nbsp&nbsp&nbsp&nbsp TOTAL HT EN EURO  &nbsp&nbsp&nbsp&nbsp
      </td>   
 </tr>
 <tr id="0">
     <td>
	<input type="text" name="ref_0" >
     </td>
 
     <td>
     <input type="text" name="designation_0"/>
    </td>
 
     <td>      
	  <input type="text" name="qte_0" id="qté_0" onKeyup="check(0)"; onchange="total()"; onkeyup="total()";/>
     </td>       
 
     <td>
     <input type="text" name="pu_0" id="prix_0" onKeyup="check(0);" onchange="total()"; onkeyup="total()";/>
     </td>   
 
     <td>
	 <input type="text" name="remise_0" id="remis_0" onKeyup="check(0);"onchange="total()"; onkeyup="total()";/>
     </td>   
 
     <td>       
     <span id="result_0" </span>
    </td>   
 
	 <td>
	 <input type="button" value="Supprimer un produit" onclick="suppression(0)"; > 
	</td>
 
 </tr>
 
 </table>

J'appelle supression(0) avec id=0 et l'id du TR=0
mais malheuresement sa ne marche pas :s:cry:

:(:roll:
Merci de votre aide

03/03/2009, 11h36
Bovino

Code:

onclick="suppression('0')"

Un id est de type chaîne, l'argument de ta fonction est un entier...
Ceci dit, '0' n'est pas un id valide... les id doivent commencer par une lettre ou underscore.

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