Updating database sort column using ajax in php

Question

I,ve got a problem in updating database sort column values using ajax in php.my database looks like the image i have sent respectively

I,m using jqueryUI plugin with sortable method in order to sort database rows by sort column values after i drag a div into another position and drop it; so my jqueryUI script is also shown as below:

 $(document).ready(function(e) { $(".sortable").sortable({ appendTo: "parent", axis: "x,y", update: function(event, ui) { var data = $(this).sortable('serialize'); $('#show').text(data); $.ajax({ data: data, type: 'POST', url: 'index.php?c=gallery&a=ajax' }); } }); }); 

I,m dealing with mvc structure so the url address is passed to: index.php?c=gallery&a=ajax

The ajax.php file contains the codes as below :

 <?php $i = 0; foreach ($_POST['item'] as $value) { $model=new galleryModel(); $model->ajax_update($i,$value); $i++; } ?> 

In the foreach loop; updating process is happening through Model file like below:

 <?php class galleryModel{ public function ajax_update($i,$value){ $model=new galleryModel(); $model->db->query("update gallery_cat set sort='$i' where sort='$value'"); } } 

So my "PROBLEM" is that when i drag a div into a new position and drop it like below for the first time;everything goes fine and the sort values are changed and being updated as desired;but when doing it for the second or third time,the sort values are being duplicated(look at image for better recognition): image So as u see,the sort values of A and C rows are the same and with refreshing the page the desired result will not happen.I think there is something wrong with the foreach loop but i can't find it.will be grateful helping me.

Answer 1

I think your problem is in front view part each time you may append to same dive or class so before append just clear your div contents Here no view html part so

I thought that you append to show div Then just add

$('#show').remove();

Before appending