jquery mise à jour triable ne peut fonctionner qu'une seule fois?

Question

Besoin d'un moyen de faire apparaître l'élément dans la div, mais quand j'utilise ajax envoyer des données à list.php.it ne peut pas fonctionner?

PHP:

<?php 
mysql_connect('localhost','user','password'); 
mysql_select_db('fruit'); 
$days = 3; 
for($i=1;$i<=$days;$i++) 
{ 
?> 



<ul id="sortable"> 
    <?php 
    $sql = "select * from menu where columnNo = '$i' order by orderNo ASC"; 
    $result= mysql_query($sql); 
    //$row=mysql_fetch_assoc($result); 
    //print_r($row); 
    while($row=mysql_fetch_assoc($result)) 
    { 
     echo '<li id="list_' . $row['id'] . '">' . $row['title'] . "</li>\n";// 
    } 

    ?> 
    </ul> 

<?php 
} 
?> 

jquery:

$(function(){ 
    $("ul").sortable({ 
     connectWith:"ul", 
     update:function() 
     {   
      serial = $("ul").sortable("serialize"); 
      $.ajax({ 
       data: serial,     
       url:"list.php", 
       type:"post", 
       error:function(){ 
        alert("Error!"); 
       }, 
       success:function(data){ 
        $("#serverResponse").html(data); 
       } 
      }); 
      //alert(serial); 
     } 
    }); 

    $("#sortable").disableSelection(); 


}); 

list.php

<?php 

mysql_connect('localhost','root','xingxing'); 
mysql_select_db('fruit'); 

$list = $_POST['id']; 

for($i=0;$i<count($menu);$i++) 
{ 


    $sql = "update menu set orderNo= '$i' where id = '$menu[$i]'"; 
    mysql_query($sql); 
} 

?> 

mais le list.php did't travail. Je ne sais pas pourquoi quelqu'un pourrait m'aider? THX!

Answer 1

Vous ne savez pas si cela vous aidera, mais vous essayez de mettre à jour chaque nouvel événement de réorganisation (est-ce vraiment nécessaire?).

Il peut être judicieux d'utiliser un délai d'attente javascript pour mettre à jour après quelques secondes d'inactivité après une mise à jour. Personnellement, j'utilise cette méthode et ça rend les choses beaucoup plus fluides.

Dans votre configuration ajouter les éléments suivants .sortable() jQuery:

start: function(event, ui){ 
    clearTimeout(allow_update); 
}, 
update: function(event, ui){ 
    allow_update = window.setTimeout(UpdateOrdering, 3000); 
} 

Et puis ajoutez var allow_update = null; quelque part et une UpdateOrdering fonction qui est appelée lorsque le délai expire (dans mon cas 3000 ms), avec votre fonctionnalité de mise à jour là-bas.

Hope this helps :)