Bonjour,
Je suis en train de découvrir Prototype et Scriptaculous, mais je bloque sur un petit point (de détail j'espère).
Je cherche à faire un tableau de scores, que l'utilisateur remplis en faisant glisser les valeurs sur les cases (exemple). Jusque là, pas de problème. A chaque fois que l'utilisateur ajoute une valeur, elle est enregistrée dans la base de données. Ce traitement se fait en AJAX, et fonctionne également.
La fonction AJAX retourne le code HTML du tableau, que je réinjecte dans la page, à la place du code de l'ancien tableau. A partir de là, les cellules n'interceptent plus les évènement. Et même si je relance un Event.observe(window, 'load', fonction, false), rien ne se passe.
Ci dessous quelques fragments du code JS
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10 function glisser0() { new Draggable('point_0', {revert: true}); } function glisser05() { new Draggable('point_05', {revert: true}); } function glisser1() { new Draggable('point_1', {revert: true}); } ...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21 function preparerCellules() { var classes = new Array('2_1', '2_2', '2_3', '2_4', '2_5', '2_6', '2_7', '2_8', '2_9', 'prof'); for (var i=0; i<classes.length; i++) { Droppables.add('h09_'+classes[i], { accept: 'points', onDrop: function(classe, cellule) { test(9, classe.id, cellule.id); } }); Droppables.add('h10_'+classes[i], { accept: 'points', overclass: 'active2', onDrop: function(classe, cellule) { test(10, classe.id, cellule.id); } }); ... } }
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12 Event.observe(window, 'load', glisser0, false); Event.observe(window, 'load', glisser05, false); Event.observe(window, 'load', glisser1, false); Event.observe(window, 'load', glisser15, false); Event.observe(window, 'load', glisser2, false); Event.observe(window, 'load', glisser25, false); Event.observe(window, 'load', glisser3, false); Event.observe(window, 'load', glisser35, false); Event.observe(window, 'load', glisser4, false); Event.observe(window, 'load', glisser45, false); Event.observe(window, 'load', glisser5, false); Event.observe(window, 'load', preparerCellules, false);
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10 function ajouterPoint(heure, point, equipe) { var demande = 'heure='+heure+'&point='+point+'&equipe='+equipe; var url = 'action/score_ajouterPoint.action.php'; requete.open("POST", url, true); requete.onreadystatechange = callbackAjouterPoint; requete.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); requete.send(demande); }
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 function callbackAjouterPoint() { if (requete.readyState == 4) { if (requete.status == 200) { document.getElementById('principal').innerHTML = requete.responseText; Event.observe(window, 'load', preparerCellules, false); } } }
Partager