[AJAX] Drag & Drop + SQL

Version imprimable

Je voudrais effectuer la même chose que ceci :
http://www.dhtmlgoodies.com/scripts/...ag-drop-2.html

mais avec une sauvegarde dans ma base de données!

Ma colonne de gauche correspondrait à la table A de ma BDD et la colonne de droite à ma table B...

Peut être pour que ce soit plus simple , il faudrait que je crée un bouton submit avec une fonction javascript pour sauvegarder les déplacements qui ont été fait entre les 2 colonnes .

Pour l'instant j'ai réussi à récupérer dans ma colonne de gauche les éléments de ma table, ensuite j'arrive à les déplacer dans la colonne de droite mais après pour effectuer la sauvegarde , là je bloque un peu ...

Je pense qu'il faut parcourir la DIV de la colonne de droite pour envoyer chaque élément dans ma BDD avec une boucle for ...

Si vous pouviez me donner des pistes pour que j'y arrive, merci ;)

je vous montre ma fonction save() qui correcpond au bouton de sauvegarde... ce que j'essaye de faire en tout cas);
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 function save() { var xhr; try { xhr = new ActiveXObject('Msxml2.XMLHTTP'); } catch (e) { try { xhr = new ActiveXObject('Microsoft.XMLHTTP'); } catch (e2) { try { xhr = new XMLHttpRequest(); } catch (e3) { xhr = false; } } } xhr.onreadystatechange = function() { if(xhr.readyState == 4) { if(xhr.status == 200) document.ajax.dyn="Received:" + xhr.responseText; else document.ajax.dyn="Error code " + xhr.status; } }; // Ici on va voir comment faire du post xhr.open("POST","checkpc2.php",true); // ne pas oublier ça pour le post xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); // ne pas oublier de poster les arguments // ici, l'id de l'auteur sel = document.getElementById('dropContent2'); xhr.send("LA JE SAIS PAS ENCORE QUOI METTRE"); }
check2.php correspond au fichier php où je ferais ma requête d'insertion dans ma table .

requete ajax

comment fait-on pour envoyer une requete sur ma BDD ??

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
 
function getXhr(){
var xhr = null; 
if(window.XMLHttpRequest) // Firefox et autres
xhr = new XMLHttpRequest(); 
else if(window.ActiveXObject){ // Internet Explorer 
try {
		xhr = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) {
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
	}
}
else { // XMLHttpRequest non supporté par le navigateur 
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
xhr = false; 
} 
			return xhr
}
 
 
function save()
{	
	var xhr = getXhr()
 
	xhr.onreadystatechange  = function()
    { 
         if(xhr.readyState  == 4)
         {
              if(xhr.status  == 200) 
                 document.getElementById('res').innerHTML= xhr.responseText; 
         }
    }; 
 
 
	var nombre = document.getElementById("dropContent").childNodes.length;
	for ( var i = 0; i<nombre ; i++){
		xhr.open("POST","checkpc2.php",true);
		xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		premier = document.getElementById("dropContent").childNodes[i].firstChild.data;
		xhr.send("ordi="+premier);
		i++;
 	}
}

Dans ma variable premier se trouve le mot ( celui qui est inscrit sur la petite boite qu'on déplace comme dans le lien ci-dessus ) que je souhaite enregistrer dans ma BDD, mais y'en aura plusieurs des mots car il y a plusieurs petites boite dans la colonne de droite, je ne sais pas comment les envoyer dans la page checkpc2 qui effectue la requete d'insertion ...merci

Aidez moi please !

ma page checkpc2.php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
        
        if(isset($_POST["save"]))
        {
                include('../connect.php');
                                
                
                $reponse=mysql_query("INSERT INTO pccheck SET NomOrdinateur='$_POST[ordi]'")or die(mysql_error()); 
                mysql_close();
 
        }
 
?>