我使用手风琴，其中使用桌子。在表中，我在其中得到了不同的位置。我编写了一个脚本来重新排序位置。在Some手风琴中，位置是相同的，因此，如果我在一个手风琴中对位置进行重新排序，这会更改具有相同位置的所有手风琴。我想如果我对一个手风琴中的位置进行重新排序，则只更改该手风琴中的位置，而不更改其中具有相同位置的其他手风琴中的位置。请帮我。这是我的代码。
这是脚本的代码：
<script>
var fixHelperModified = function(e, tr) {
var $originals = tr.children();
var $helper = tr.clone();
// console.log($helper)
$helper.children().each(function(index) {
$(this).width($originals.eq(index).width())
});
return $helper;
},
updateIndex = function(e, ui) {
$('td.index', ui.item.parent()).each(function (i) {
$(this).html(i + 1);
});
};
$("#sort tbody").sortable({
helper: fixHelperModified,
stop: updateIndex,
update: function(event, ui) {
var list_sortable = $(this).sortable('toArray').toString();
// change order in the database using Ajax
$.ajax({
url: '{{url('admin/locations/updateOrder')}}',
type: 'POST',
data: {list_order:list_sortable,_token:'{{csrf_token()}}'},
success: function(data) {
//finished
}
});
}
});
</script>
这是我的index.blade.php的代码
@extends('admin.layout')
@section('css')
<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-
editable/css/bootstrap-editable.css" rel="stylesheet"/>
<link rel="stylesheet" href
="https://cdn.datatables.net/1.10.13/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" href ="https://cdn.datatables.net/responsive/2.1.1/css/responsive.bootstrap.min.css ">
@endsection
@section('content')
<h1 class="page-header">Locations page</h1>
<div class="clearfix">
<div class="pull-right" style="margin-bottom: 5px">
<a href="{{ route('locations.create') }}" class="btn btn-success"><i class="fa fa-plus" aria-hidden="true"></i> Create Location</a>
</div>
</div>
@if(count($trails) > 0)
<div class="panel-group" id="accordion" style="margin-top: 10px;">
<?php $count = 0;?>
@foreach($trails as $getTrail)
<div class="panel panel-default">
<div class="panel-heading">
<a data-toggle="collapse" data-parent="#accordion" href="#collapse{{$getTrail->trail_id}}" style="text-decoration: none !important;">
<h4 class="panel-title">
<span>
{{++$count}}:
</span>
{{ucwords($getTrail->trail_title)}}
<span class="label bg-primary pull-right" style="padding-top: 3px;">
Total Locations: {{count($getTrail->location)}}
</span>
</h4>
</a>
</div>
<div id="collapse{{$getTrail->trail_id}}" class="panel-collapse collapse @if($count == 1) in @endif">
<div class="panel-body">
<div class="table-responsive">
<table id="sort" class="example table table-striped dt-responsive" cellspacing="0" width="100%">
<thead>
<tr>
<th>Id</th>
<th>Title</th>
<th>Rewards Points</th>
<th>Map options</th>
<th>Created At</th>
<th>Updated At</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach($getTrail->location as $location)
<tr id="{{ $location->id }}" style="cursor: move;">
<td>{{ $location->id }}</td>
<td>
{{ $location->title }}<br>
<a href="{{ route('locations.hints', ['id' => $location->id]) }}" class="btn btn-primary" style="margin-top: 5px">Location Hints</a>
</td>
<td>{{ $location->rewards_points }}</td>
<td>{{ $location->latitude }} {{ $location->longitude }},<br/>radius: {{ $location->radius }}</td>
<td>{{ $location->created_at->date }}</td>
{{-- <td> {{ $location->location_order }}</td>--}}
<td>{{ $location->updated_at->date }}</td>
<td>
<a title="{{ $location->title }}" href="{{ route('locations.show', ['id' => $location->id]) }}">
<i class="fa fa-eye" aria-hidden="true"></i>
</a>
<a title="{{ $location->title }}" href="{{ route('locations.edit', ['id' => $location->id]) }}">
<i class="fa fa-pencil" aria-hidden="true"></i>
</a>
<a href="#" data-toggle="modal" data-target="#mySmallModalLabel{{ $location->id }}" data-location="{{ $location->id }}">
<i class="fa fa-trash" aria-hidden="true"></i>
</a>
<div class="modal fade small_modal_delete" tabindex="-1" role="dialog" id="mySmallModalLabel{{ $location->id }}">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Deleting the location</h4>
</div>
<div class="modal-body">
Are you sure want to delete this location?
<form action="{{url('admin/locations/'.$location->id)}}" method="POST">
<input name="_method" type="hidden" value="DELETE" />
{{ csrf_field() }}
<button class="btn btn-default" type="submit">Delete</button>
</form>
</div>
</div>
</div>
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
@endforeach
</div>
@else
<div class="col-lg-12 alert alert-warning" style="margin-top: 10px;">
No Locations found
</div>
@endif
这是控制器的代码
public function updateOrder(){
// get the list of items id separated by cama (,)
$list_order = $_POST['list_order'];
// convert the string list to an array
$list = explode(',' , $list_order);
$i = 1 ;
foreach($list as $id) {
Location::whereId($id)->update(['location_order'=>$i]);
$i++ ;
}
}