更改图像的顺序并在数据库中更新

Question

I have an HTML list and I want to change their order with drag and drop and also update in database. But I do not know how it is done. Can you helpl me? I used HTML5sortable plugin, but it does not update in db.

Here is my list:

<ul class="sortable grid" >
    <?php
        $images = get_children(array('post_parent' => $id, 'post_status' => 'inherit', 'post_type' => 'attachment', 'order' => 'ASC', 'orderby' => 'menu_order ID'));
        $i = 0;
        foreach ($images as $value) {
    ?> 
    <li style='list-style-type: none' >
        <img src='<?php echo $value->guid;?>' width='90' />
        <a class='btn btn-danger' href='#' onclick='deletePic(<?php echo $i;?>)'>
            <i class='icon-trash icon-white'></i>
            Delete
        </a>
    </li>       
    <?php $i++; } ?>
</ul>

Answer 1

write a ajax call inside sortupdate event handler

$('.sortable').sortable().bind('sortupdate', function() {
   var menuId=[];
   //store list id or some other unique field to identify your image into menuId variable
 var request = $.ajax({
   url: "script.php",
   type: "POST",
   data: { id : menuId },
   dataType: "html"
 });

});