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!

Answer 1

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 🙂