[AJAX] Création d'un compteur dynamique

Version imprimable

Bonjour,
J'ai un formulaire avec plusieurs lignes qui comprennent chacune un champ date_delai et valeur_delai a additionner, je souhaite additionner valeur_delai et remettre le compteur a zero si le champ date_delai change mais je n'y arrive pas. voici ou j'en suis mais cela ne fonctionne pas .

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
<script>
 function countDelai(dt, nbr)
 {
 if (nbr=="")
   {
   document.getElementById("txtHint").innerHTML="";
   return;
   }
if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","list_ressource.php?date_delai="+dt+"&valeur_delai="+nbr, true);
 xmlhttp.send();
 }
 </script>
 </head>
 <body>
 <form>
 
 Date: <input id="dt" name="date_delai[]" type="text"  onFocus="countDelai(this.value,document.getElementById('dt').value)">
 Valeur : <input id="nbr" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr').value)"></br>
 Date: <input id="dt" name="date_delai[]" type="text"  onFocus="countDelai(this.value,document.getElementById('dt').value)">
 Valeur : <input id="nbr" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr').value)"></br>
 Date: <input id="dt" name="date_delai[]" type="text"  onFocus="countDelai(this.value,document.getElementById('dt').value)">
 Valeur : <input id="nbr" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr').value)"></br>
 
 </form>
 <br />
 <div id="txtHint"><b>Person info will be listed here.</b></div>

D'avance merci

16/10/2012, 18h19
Golgotha

Bonjour,

Je voie dans ton code que tu fait un getElementById('dt') Alors que plusieurs éléments de ta page ont cet id.

Attention à ce genre de chose. ;)
17/10/2012, 13h48
chkdsk

Citation:

Envoyé par Golgotha

Bonjour,

Je voie dans ton code que tu fait un getElementById('dt') Alors que plusieurs éléments de ta page ont cet id.

Attention à ce genre de chose. ;)

Oui merci mais en tableau [] j'ai une erreur
17/10/2012, 14h10
Bovino

En tableau ? :calim2: :cry:

Un id doit être unique dans la page !
17/10/2012, 14h14
Golgotha

:ptdr:

:dehors:
17/10/2012, 15h11
andry.aime

Bonjour,

Citation:

Date: <input id="dt" name="date_delai[]" type="text" onFocus="countDelai(this.value,document.getElementById('dt').value)">
Valeur : <input id="nbr" name="valeur_delai[]" type="text" onchange="countDelai(this.value,document.getElementById('nbr').value)"></br>

Les paramètres de l'un de ses 2 inputs doivent être permutés aussi, sinon tu envoies les mauvaises valeurs.

A+.
17/10/2012, 17h45
chkdsk

Citation:

Envoyé par andry.aime

Bonjour,

Les paramètres de l'un de ses 2 inputs doivent être permutés aussi, sinon tu envoies les mauvaises valeurs.

A+.

Ok merci
17/10/2012, 20h06
chkdsk

Personne ne veut m'aider à rendre mon code fonctionnel ?
18/10/2012, 05h35
andry.aime

On a tout dit pourquoi ton code ne fonctionne pas mais peut-on voir les corrections apportées?
N'attend pas qu'on le fasse à ta place quand même.

A+.

Oui effectivement, désolé, voici ma correction qui fonctionne presque :)
Le soucis est que si je reviens en arrière et modifie le champ date il inverse les valeurs

Code:

1
2
3
4
5
6
7
8
9
10
<form>
 
 Date: <input id="dt1" name="date_delai[]" type="text" onchange="countDelai(this.value,document.getElementById('nbr1').value)" >
 Valeur : <input id="nbr1" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('dt1').value)"></br>
 Date: <input id="dt2" name="date_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr2').value)">
 Valeur : <input id="nbr2" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('dt2').value)"></br>
 Date: <input id="dt3" name="date_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr3').value)">
 Valeur : <input id="nbr3" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('dt3').value)"></br>
 
 </form>

Merci à tous.

Citation:

Envoyé par chkdsk

Oui effectivement, désolé, voici ma correction qui fonctionne presque :)
Le soucis est que si je reviens en arrière et modifie le champ date il inverse les valeurs

Code:

1
2
3
4
5
6
7
8
9
10
<form>
 
 Date: <input id="dt1" name="date_delai[]" type="text" onchange="countDelai(this.value,document.getElementById('nbr1').value)" >
 Valeur : <input id="nbr1" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('dt1').value)"></br>
 Date: <input id="dt2" name="date_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr2').value)">
 Valeur : <input id="nbr2" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('dt2').value)"></br>
 Date: <input id="dt3" name="date_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('nbr3').value)">
 Valeur : <input id="nbr3" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,document.getElementById('dt3').value)"></br>
 
 </form>

Merci à tous.

Citation:

Envoyé par andry.aime

Bonjour,

Les paramètres de l'un de ses 2 inputs doivent être permutés aussi, sinon tu envoies les mauvaises valeurs.

A+.

plus haut :mouarf:.

A+.

19/10/2012, 16h13
chkdsk

Citation:

Envoyé par andry.aime

Bonjour,

Les paramètres de l'un de ses 2 inputs doivent être permutés aussi, sinon tu envoies les mauvaises valeurs.

A+.

Là par contre je en comprend pas :(

Quelque chose comme ça:

Code:

1
2
Date: <input id="dt1" name="date_delai[]" type="text" onchange="countDelai(this.value,document.getElementById('nbr1').value)" >
 Valeur : <input id="nbr1" name="valeur_delai[]" type="text"  onchange="countDelai(document.getElementById('dt1').value,this.value)"></br>

Code:

1
2
Date: <input id="dt1" name="date_delai[]" type="text" onchange="countDelai(document.getElementById('nbr1').value,this.value)" >
 Valeur : <input id="nbr1" name="valeur_delai[]" type="text"  onchange="countDelai(this.value,, document.getElementById('dt1').value">

20/10/2012, 13h46
chkdsk

:ccool: Merci effectivement ça fonctionne.
Mais tu pourrais m'expliquer stp ?
20/10/2012, 14h22
andry.aime

Regarde les paramètres de la fonction et les valeurs que tu passes pendant l'appel.

A+.