I have this js code
$("#sortable").sortable({
axis: 'y',
handle: '.fancybox',
update: function() {
var order = $('#sortable').sortable('serialize');
$("#sortable").load("inc/ajax/sortable/update2.php?"+order);
alert(order);
}
});
and I populate the list with php:
foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $result)
{
$_SESSION['img'][]=$result['id_imag'];
$img[]="
<div class='highlight-3' width='100%'>
<li id='".$result['id_imag']."'>
<a class='fancybox' href='".$result['den_img']."' data-fancybox-group='gallery' title='Reian Imob' >
<img src='".$result['den_img']."' id='".$result['id_imag']."' ></a>
<a href='#' id='".$result['id_imag']."' class='del' onclick='delete_imag_mod(this);' >Delete</a>
</li>
</div>";
}
The html:
<ul class="gallery" id="sortable" style="background:#FCFCFC; width:100%">
<?php
$images=$db->select_images ($_POST['vid']);
if($nr_imag>0) {
foreach($images as $val)
{
echo $val;
}
}
?>
</ul>
The problem is: var order don't get the values. How can I fix it?
Your html
code should look something like this:
<ul id="sortable">
<li id="li_first"> // here undercsore is mandatory
<div>some text</div>
</li>
<li id="li_second"> // here undercsore is mandatory
<div>some text</div>
</li>
</ul>
For more info check this link : http://api.jqueryui.com/sortable/#method-serialize