[jQuery 1.6.2] Drag'n'Drop listes
Bonjour,
comme dit dans le titre je cherche à faire un drag'n'drop entre listes (ul). Mon application comporte 3 listes où chaque élément est droppable dans n'importe quelle liste sachant que le première est initialisée par le serveur (requête BDD).
Je suis parvenu à faire un drag'n'drop depuis ma liste préchargée vers n'importe quelle autre liste. Cependant, si je reprends les éléments dropé il m'est impossible de les drager à nouveau.
Ci-joint mon code actuel :
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
|
<script type="text/javascript">
$jq(document).ready(function(){
$jq("#listes li").draggable({revert: 'invalid'});
$jq("#listes ul").droppable({tolerance : 'pointer',
drop : function(e, ui){
optionVal = ui.draggable.val();
optionNom = ui.draggable.html();
ui.draggable.remove();
$(this).append('<li value="'+optionVal+'">'+optionNom+'</li>');
}
});
});
</script>
<div id="listes">
<div id="droite" style="float:right">
<ul id="add">
</ul>
<ul id="suppr">
</ul>
</div>
<ul id="default">
<?php
$motscleIn = mysql_query("select * from motcle where idMC in (select idMC from association where idSolution = ".$_GET['sol'].")");
while($motIn = mysql_fetch_array($motscleIn)){
echo '<li value="'.$motIn[0].'">'.$motIn[1].'</li>';
}
?>
</ul>
</div> |
ma version de jQuery est la 1.6.2 et celle de jQuery-ui est 1.8.14.
