Déplacement d'élément avec jQuery

Bonjour,
J'ai une petite question, voilà je fais un planning où les événements sont déplaçables lorsqu'ils ont l'id "drag". Lorsqu'on double-clique sur un jour du planning, un nouvel événement s'insère, on peut modifier sa taille, et il faut ensuite appuyer sur un bouton pour l'insérer dans ma base de données. Lorsqu'un événement est dans la base de données, évidemment si l'utilisateur reviens sur la page, l’événement s'affichera.

Maintenant imaginons que, après avoir ajouté cet événement à la base de données, l'utilisateur veule changer le jour de cet événement et donc le déplace avec sa souris..

Là est mon problème, j'arrive à mettre à jour ma base de données si l'utilisateur change la durée de l’événement (en le redimensionnant) mais pas s'il le déplace sur un autre jour, même en faisant un alert du jour de l'evenement, il garde en mémoire le jour où on l'a inséré. J'aimerais savoir si c'est possible déjà, et si oui auriez vous une piste à me donner?

Citation:

les événements sont déplaçables lorsqu'ils ont l'id "drag".

Déjà, sans voir ton code, cette phrase pose un problème : un id doit être unique dans la page !

Merci d'avoir pris le temps de répondre,
Je me suis trompé c'est la classe de l'élément qui est nommé 'drag' :oops:..

Oui, mais c'est tout ce que je peux te dire sans voir ton code... :mrgreen:

Bah mon code est super long et je suis sure qu'il ferait peur à n'importe quelle personne qui s'y connait vu qu'il doit etre bourré de chose a ne pas faire lorsque l'on code, fin je peux vous montrer quelque petit bout qui semble important haha.

Donc mon tableau avec une requete pour le remplir en fonction de 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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
$sql = "SELECT * FROM technicien ";
	$sql = $sql . "LEFT JOIN (SELECT * FROM deplacement WHERE (mois = $mois AND annee = $annee)) AS dep ";
	$sql = $sql . "ON technicien.num = dep.numTech "; // Jointure externe avec alias
	$sql = $sql . "ORDER BY technicien.nomTech, jour;";  // Tri par technicien (important)
	$resultat = $dbh->query($sql);
	$row=$resultat->fetch();
 
	// Constitution du tableau pret a etre affiché
	$tabResultat = array();
	$i = -1;
	$tech = '';
	while ($row) {
		if ($tech != $row['nomTech']) {  // Changement de technicien
			$i++;
			$tech = $row['nomTech'];
			$tabResultat[$i] = array($nbJourMois +1);
			// Initialisation de la ligne
			for ($j = 0; $j <= $nbJourMois; $j++) {
				$tabResultat[$i][$j] = '';
			}
		}
		$tabResultat[$i][0] = $tech;
		$j = $row['jour'];
		$tabResultat[$i][$j] = $row['type'];
		$row=$resultat->fetch(); // lecture suivante
	}
	// Parcours du tableau et affichage
	echo "<table id='tableau'>";
	echo "<caption>Planning du mois de $moisS</caption>";
	echo "<thead>";
	// Affichage des nos de semaine
	echo "<tr><th></th>";
	for ($i=1; $i<=$nbJourMois; $i++) {
		$dj = $mois . "/" . $i . "/" . $annee;
		$noSem = date('W', strtotime($dj));
		echo "<th>" . $noSem . "</th>";
	}
	echo "</tr>";
	// Affichage des jours du mois
	echo "<tr><th></th>";
	for ($i=1; $i<=$nbJourMois; $i++) {
		echo ("<th class='jour'>$i</th>");
	}
	echo "</tr></thead><tbody>";
	$nbLigne = sizeof($tabResultat);
	for ($i = 0; $i < $nbLigne ; $i++) {
		$nom=$tabResultat[$i][0];
		echo "<tr id='$nom'>";
		for ($j = 0; $j <= $nbJourMois; $j++) {
			if ($j == 0) {
				echo "<td id='technicien'>" . $tabResultat[$i][$j] . "</td>";
			}
			else {
				echo("<td id='$j' class='jour'>");
				if ($tabResultat[$i][$j] <> '') {
					$sql = "SELECT nbJour from deplacement where jour = '$j';";  // Tri par technicien (important)
					$resultat = $dbh->query($sql);
					$row=$resultat->fetch();
					$nbJ = $row['nbJour'];
					$taille = 25 + (28 * ($nbJ-1));
					$tailleS = strval($taille);
					$taillePx = $tailleS.'px';
					$type = $tabResultat[$i][$j];
					echo ("<div id ='$type' class='drag' style='width:$taillePx;'></div>");
				}	
				echo "</td>";
			}
		}
		echo "</tr>";
	}
	echo "</tbody></table>
	<input type ='submit' id ='btn' value ='Mettre à jour les déplacements'></input>";

Un evenement est inséré avec ce bout de code

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
$('.jour').dblclick(function(){
	abs = prompt('Quel est le type d\'absence du technicien? Veuillez ecrire en majuscule');
	switch (abs) {	
		case 'SAVF' :
			$(this).append($('<div id ="SAVF" class="drag"></div>'));
			$('.drag').draggable({
				revert : 'invalid',
				grid : [28,28]
			});
 
			$('.drag').resizable({
				minWidth : 25,
				maxWidth : 865,
				minHeight : 25,
				maxHeight : 300
			});
			cpt2=cpt2+1;
		break;
		case 'CONGE' :
			$(this).append($('<div id ="CONGE" class="drag"></div>'));
			$('.drag').draggable({
				revert : 'invalid',
				grid : [28,28]
			});
 
			$('.drag').resizable({
				minWidth : 25,
				maxWidth : 865,
				minHeight : 25,
				maxHeight : 300
			});
			cpt2=cpt2+1;
		break;
}
});

et donc ma bdd est mise à jour grace a ce bout de code là

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
$('#btn').live('click', function(){
	$('.drag').each(function(i){
		nbJ = (($(this).width()-25) / 28)+1;  
		var moisS = $('#ldrMois option:selected').val();
		var mois = parseInt(moisS);
		var type = $(this).attr('id');
		var lesCases = $(this).parent();
		var lesJourJ = lesCases.attr('id');
		var lesLigneJ = lesCases.parent();
		var lesTechJ = lesLigneJ.attr('id');
		var jourJF = parseInt(lesJourJ)+nbJ-1;
 
  		$.post(
			'postBDD.php',
			{ jour : lesJourJ,
			mois : mois,
			tech : lesTechJ,
			type : type,
			nbJ : nbJ
			},
			function(data){
				alert (data);
			},
			'text'
		); 
	});
});

Voilà le monstre ^^