Traitement AJAX de lignes automatique
Bonjour,
Bon, ça fait un jour complet que je galère avec ce truc. Je vous prie de m'aider un peu ...
J'ai actuellement ce code qui marche. Il présente au départ une ligne avec deux champs à remplir. Dès qu'on clique dessus ça en rajoute une, etc. J'aimerais que lorsqu'on clique sur une ligne, ça rentre les données dans la bdd en ajax. Une fois envoyé, on change : <div class=state>Pas envoyé</div>
J'essaie de faire ça avec jQuery, mais j'ai du mal à savoir comment va devoir se présenter le truc. J'aurais bien fais un selector sur name="id" et name="surf". Mais après je sais pas quoi en faire, ni comment l'utiliser dans le $.post. Et encore moins comment gérer mon class=state.
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
| <script src="http://code.jquery.com/jquery-1.5.js"></script>
<table id="tableau">
<tr>
<th>Numéro de parcelle</th>
<th>Surface</th>
<th>État</th>
</tr>
</table>
<script>
var nbligne = 1;
document.write('<form action="/" id="addline">');
function nouvelleligne(nbligne){
return '<tr name="'+ nbligne +'" onKeyPress="ajouterligne($(this));" onclick="ajouterligne($(this));">' +
'<td><input name="id" type="text" /></td>' +
'<td><input name="surf" type="text" /></td>' +
'<td><div class=state>Pas envoyé</div></td>' +
'</tr>';
}
// on crée la première ligne
var nouvelle_ligne = nouvelleligne(nbligne);
$(nouvelle_ligne).appendTo("#tableau");
document.write('</form>');
function ajouterligne(ligne){
// Si c'est la dernière ligne
if(ligne.attr('name') == nbligne){
// On insert la nouvelle ligne
nbligne ++;
var nouvelle_ligne = nouvelleligne(nbligne);
$(nouvelle_ligne).insertAfter(ligne);
// on change la variable nbligne et on l'affiche
$("#result").html("nb ligne = " + nbligne);
}
}
</script> |
Bref un grand merci à ceux qui veulent bien prendre part.
