Jqueryui lista ordenable con actualización ajax

Question

Estoy usando CodeIgniter con el widget jQuery UI Sortable, para cambiar la posición de mi lista de menú.

Por ejemplo, si mi lista de menú es la siguiente:

<li>menu 1</li> 
<li>menu 2</li> 
<li>menu 3</li> 
<li>menu 4</li> 

que desee colocar el primer menú en la segunda y tienen que permanecer allí.

Sin embargo, estoy un poco atrapado en el jQuery.

Esto es lo que obtiene los elementos de la lista:

<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> 

y el jQuery:

$("#sortable").sortable({ 
    placeholder: "ui-state-highlight", 
    opacity: 0.6, 
    update: function(event, ui) { 
     var info = $(this).sortable("serialize"); 
     alert(info); 
    } 
}); 
$("#sortable").disableSelection(); 

me las arreglé para alertar al conjunto de los resultados.

Ahora no quiero que nadie escriba esto para mí, solo una pista sobre cómo usar ajax con esto para la actualización.

Answer 1

Creo que puede usar $ .ajax (..) dentro de su método de actualización.

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

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

acabo de comprobar información ya está en serie, por lo que este debería funcionar. Puede agregar la propiedad method dependiendo del tipo de envío (publicación, obtención).

Answer 2

En primer lugar gracias por Kamil Lach para su pista, i logró hacerlo

Aquí está mi código tal vez alguien Wull hacer un uso para él

creado una función en mi controlador y carga el modelo en ella

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

el modelo

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

    } 

} 

el p $ vaiabl e es la posición corta y el id es el identificador del menú

y el 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(); 

pasé la url a mi función de controlador que se carga mi modelo de actualización

y el archivo de vista

<?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"; 
    } 

    ?> 

Y gracias de nuevo por su toque Kamil Lach