I am using drag and drop jquery code for datatable. My drag and drop for row first(1) 10 recorders working correctly in datatable when move on next page second(2) it's not working correctly. On the second page of datatable row not drag and drop correctly and in database position column not updating correctly its make column position with value 1 on second page. my problem now how to update position column in datatable on all pages first, second, third so on...
i have tried to change position with $value['position'] = ('$pages_row * $page_size) + $key;
<script>
$(document).ready(function() {
var $sortable = $( "#athlete-class-datatable-responsive > tbody " );
$sortable.sortable({
stop: function ( event, ui ) {
var parameters = $sortable.sortable( "toArray" );
alert(parameters);
var url = '/godspeed/Athlete_class/updatePositions';
$.post(url,{value:parameters},function(result){
alert(result);
});
}
});
});
</script>
controller
public function updatePositions() {
foreach ($_POST["value"] as $key => $value) {
$data["position"] = $key; // i am unable to change position on next page
$this->Athlete_classes->updatePosition($data,$value);
}
echo "Sorting Done";
}
model
function updatePosition($data,$id){
if(array_key_exists("from", $data)){
$data["from"]=$this->real_escape_string($data["from"]);
}
foreach ($data as $key => $value) {
$value="'$value'";
$updates[]="$key=$value";
}
$imploadAray = implode(",", $updates);
$query=$this->db->query("Update dev_athlete_class SET $imploadAray Where id='$id'");
}
my html code is
<table class="table table-bordered table-striped" id="athlete-class-datatable-responsive">
<!--<table id="athlete-class-datatable-responsive" class="table table-striped table-bordered dt-responsive nowrap bulk_action" cellspacing="0" width="100%">-->
<thead>
<tr>
<th class="no-sort" style="width: 30px;" ><input type="checkbox" id="check-all" class="flat check_all" data-check="athlete_class_list" ></th>
<th>id</th>
<th>Position</th>
<th>From Time</th>
<th>To Time</th>
<th class="no-sort" style="width: 50px;text-align: center;" >Edit</th>
</tr>
</thead>
<tbody>
<?php foreach ($data['Exercise_multiplier_datas'] as $key => $value) { ?>
<!--<tr>-->
<tr id="<?php echo $value["id"]; ?>">
<td style="vertical-align: middle;"><input type="checkbox" id="<?php echo $value['id']; ?>" class="flat athlete_class_list multiple_delete"></td>
<td><?php echo $value["id"]; ?></td>
<td><?php echo $value["position"]; ?></td>
<td style="vertical-align: middle;"><?php echo $value['from']; ?></td>
<td style="vertical-align: middle;"><?php echo $value['to']; ?></td>
<!--<td style="width:4%"><img src="<php echo base_url() ?>assets<php echo $value['image']; ?>" class="user_image_athlete_level_image" style="width:70px;height:70px"></td>-->
<td style="text-align: center;vertical-align: middle;"><a href="#/pencil-square-o" class="edit_Athlete_class option_icon" data-json='<?php echo htmlspecialchars(json_encode($value, TRUE), ENT_QUOTES, 'UTF-8'); ?>' data-block="school_form_block" data-form="school_form" ><i class="fa fa-edit"></i></a></td>
<input type="hidden" value="<?php echo $value["id"]; ?>" id="item" name="item">
</tr>
<?php } ?>
</tbody>
</table>
my datatable is like that on the sencod page its show position id 10 same id show
id | from | to | position
1 18:00 19:00 1
2 20:00 21:00 2
3 18:00 22:00 3
4 12:00 23:00 4
5 18:00 24:00 5
6 12:00 25:00 6
7 18:00 26:00 7
8 12:00 27:00 8
9 18:00 28:00 9
10 12:00 29:00 10
11 18:00 19:00 1
12 12:00 01:00 2
I want an actual result in datatable like this with current position id
id | from | to | position
1 18:00 19:00 1
2 20:00 21:00 2
3 18:00 22:00 3
4 12:00 23:00 4
5 18:00 24:00 5
6 12:00 25:00 6
7 18:00 26:00 7
8 12:00 27:00 8
9 18:00 28:00 9
10 12:00 29:00 10
11 18:00 19:00 11
12 12:00 01:00 12