JQuery / Ajax -> Sauvegarde dans la BD
Bonjour,
J'ai un soucis, j'ai trouvé un code sur le net que je voudrais adapter à mon projet mais une partie (la plus importante bien sur :lol: ) ne marche pas.
Je voudrais 'dragger' une div d'un endroit à un autre et lorsque je lache la div que sa position soit sauvegarder dans la BD, pour la dragger c'est pas bien dur mais au moment ou je la lache j'arrive à avoir sa position et lorsque je veux la sauvegarder dans la BD, bah ça marche pas :/
Le code :
Dans ma page PHP j'attribue la position à ma div à partir des valeurs prise dans la BD:
Code:
1
2
3
4
5
| $req = $this->conbdd->query('SELECT NomTableau, idMessage, TexteMessage, PosTop, PosLeft FROM tableau, message WHERE message.IdTableau = '.$numB.' AND tableau.idTableau = '.$numB.' AND tableau.idTableau = message.idTableau');
while($list = $req->fetch()){
$codeHtml.='<div id="'.$list['idMessage'].'" class="draggable" onclick="position('."'".''.$list['idMessage'].''."'".')" style="border: 1px solid grey; position: absolute; top:'.$list['PosTop'].'px; left:'.$list['PosLeft'].'px;">'.$list['TexteMessage'].'</div>';
}
$codeHtml.='</div>'; |
Lorsque je clique sur ma div position.js ce lance :
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
| function position(idIdentifiant)
{
jQuery.fn.extend({
findPos : function() {
obj = jQuery(this).get(0);
var curleft = obj.offsetLeft || 0;
var curtop = obj.offsetTop || 0;
while (obj = obj.offsetParent) {
curleft += obj.offsetLeft
curtop += obj.offsetTop
}
return {x:curleft,y:curtop};
}
});
var myObj = document.getElementById(idIdentifiant);
pos = $(myObj).findPos();
var posX = pos.x;
alert(posX);
var posY = pos.y;
alert(posY);
$.ajax({
type: "POST",
url: "http://127.0.0.1:8080/wb/up_pos.php",
data: "id_identifiant="+idIdentifiant+"&posX="+posX+"&posY="+posY,
});
alert('plop');
}; |
Qui est censé (si j'ai bien compris) lancer up_pos.php :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| <?php
if(isset($_POST['id_identifiant']) && isset($_POST['posX']) && isset($_POST['posY']))
{
try
{
$connection = new PDO('mysql:host=localhost;dbname=wb', 'root', '');
$connection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$posX = $_POST['posX'];
$posY = $_POST['posY'];
$idMessage = $_POST['id_identifiant'];
if(!$connection->query("UPDATE message set PosLeft = ".$posX.", PosTop = ".$posY." WHERE idMessage = ".$idMessage)) echo 'Requête échouée';
}
catch(Exception $e)
{
die('Erreur : '.$e->getMessage());
}
}
?> |
Traitement :
- Je clique sur ma div puis la drag où je veux sur l'écran
- Lorsque je lache ma div j'ai bien les 3 alerts qui apparaissent
- Je recharge ma page mais ma div revient à sa position initiale et l'update dans la bd n'a pas été faite.
Merci d'avance pour votre aide !
