Jqueryui sortable list with ajax update Jqueryui sortable list with ajax update ajax ajax

Jqueryui sortable list with ajax update


I think you can use $.ajax(..) inside your update method.

http://api.jquery.com/jQuery.ajax/

$.ajax({  url: "submit.php",  data: info,  context: document.body,  success: function(){    // success  }});

I just check info is already serialized, so this should work. You can add method property depending on submit type (post, get).


First of all thanks for Kamil Lach for his hint, i managed to do it

Here is my code maybe someone wull make a use for it

created a function in my controller and loaded the model in it

function sort_items(){    $this->load->model("admin/pages_model");    $this->pages_model->sort_insert();}

the model

function sort_insert(){    foreach($this->input->post("sort")  as $p => $id)    {        $this->db->query(" UPDATE c_pages SET sort = ".$p." WHERE pid = ".$id." ");    }   }

the $p vaiable is the short position and the id is the menu id

and the jquery

$( "#sortable" ).sortable({        placeholder: "ui-state-highlight",        opacity: 0.6,    update: function(event, ui) {        var info = $(this).sortable("serialize");        $.ajax({            type: "POST",            url: "http://localhost/frame/admin/pages/sort_items",            data: info,            context: document.body,            success: function(){                // alert("cool");            }      });    }    });    $( "#sortable" ).disableSelection();

i passed the url to my controller function where my update model is loaded

and the view file

<?php  if($rows) { ?>    <ul id="sortable">          <?php  foreach ($rows as $r)        {            echo '            <li id="sort_'.$r->pid.'" class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>                 ' . $r->page_name . '            </li>';        }        ?>    </ul>    <?php } else    {        echo "There are no pages created yet";    }      ?>

And thanks again for your hint Kamil Lach