jquery sortable update can work only one time?
-
07-07-2019 - |
Question
Need a way to make element show in the div,but when i use ajax send data to list.php.it can not work?
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);
}
?>
but,the list.php did't work. i don't know why.could anyone can help me ? THX!
Solution
Not sure if this will help, but your trying to update on every single reorder event (is this really necessary?).
It might be wise to use a javascript timeout to update after a couple seconds idle time after an update. I personally use this method and it makes things run a lot smoother.
In your jQuery .sortable() setup add the following:
start: function(event, ui){
clearTimeout(allow_update);
},
update: function(event, ui){
allow_update = window.setTimeout(UpdateOrdering, 3000);
}
And then add var allow_update = null; somewhere and an UpdateOrdering function which is called when the timeout expires (in my case 3000 ms), with your update functionality in there.
Hope this helps :)