Bonjour à tous,

Je suis opposé à un problème face auquel j'ai eu beau me retourner les méninges, je n'ai pas trouvé la solution.

Je vous l'explique:

j'ai une page index.php sur laquelle j'utilise une bibliothèque javascript pour faire du drag and drop sur une liste avec des "<li>". Cela fonctionne très bien si je remplis mon code dans cette page index.php.

En revanche, lorsque j'utilise EXACTEMENT le même code avec de l'ajax pour remplir cette liste à l'aide d'une page "update.php", la liste s'affiche de la même manière, elle amène exactement ce qu'il faut mais je n'arrive pas à faire mon drag and drop dessus.

Voici mon code ajax:

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
 
var xhr=null;
 
	if (window.XMLHttpRequest) { 
		xhr = new XMLHttpRequest();
	}
	else if (window.ActiveXObject) 
	{
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
	}
 
	xhr.open("GET", "update.php", true);
 
	xhr.onreadystatechange = function() {
		if(xhr.readyState == 4 && xhr.status == 200) {
 
			document.getElementById('ReloadThis').innerHTML = xhr.responseText;
 
		}
	}
	xhr.send(null);
Je suppose actuellement que l'erreur viendrait d'une mauvaise interprétation des balises html avec "innerHTML".


Voici ce que je dois importer de la page "update.php" :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
 
<div id="contentRight">
	<ul id="test-list02">
		<li id="listItem_1"><img src="arrow.png" alt="move" width="16" height="16" class="handle" />Titanic </li>
		<li id="listItem_2"><img src="arrow.png" alt="move" width="16" height="16" class="handle" />Tous les matins du monde</li>
		<li id="listItem_3"><img src="arrow.png" alt="move" width="16" height="16" class="handle" />Pearl Harbor</li>
		<li id="listItem_4"><img src="arrow.png" alt="move" width="16" height="16" class="handle" />C'est arrivé près de chez vous</li>
		<li id="listItem_5"><img src="arrow.png" alt="move" width="16" height="16" class="handle" />Forest Gump</li>
	</ul>
</div>
Je rappelle que quand je mets le contenu de "update.php" directement dans "index.php", j'arive à faire un drag and drop sur chaque "<li>" de manière séparée. Si je l'importe depuis "update.php" via l'ajax, je n'arrive à faire du drag and drop que sur un seul "<li>", peut importe lequel, tous les "<li>" viennent en un seul bloc.

QUelqu'un peut il me trouver la solution à mon problème?

UN TOUT GRAND MERCI D'AVANCE.

PS: je précise que je dois absolument l'amener en ajax depuis une autre page ce code.