我有问题返回json数据并在laravel中对它们进行排序,它们只是随机出现.
到目前为止我做了什么
>我试图通过他们的数据库和帮助来返回数据
JavaScript喜欢:
result.sort(function(a,b){
返回(a.id> b.id)? 1 :((b.id> a.id)? – 1:0);
});
结果是随机顺序(排序)
>我在我的数据库中添加了排序列,并试图获取我在那里提供的数据的数据库(结果是随机顺序)
>我试图在我的功能代码中添加 – > orderByRaw(‘set_specification.sort’)并获取订单(结果是随机顺序)
逻辑
>我选择一套
>设置子项将按照我的排序列顺序出现在刀片上
提供数字.
码
调节器
public function selectset($id){
$selectsets = DB::table('sets')
->where('sets.id', '=', $id)
->join('set_specification', 'sets.id', '=', 'set_specification.set_id')
->join('specifications', 'set_specification.spec_id', '=', 'specifications.id')
->orderByRaw('set_specification.sort')
->get();
return response()->json($selectsets);
}
JavaScript的
$(document).ready(function() {
$('select[name="selectset"]').on('change', function() {
var id = $(this).val();
if(id) {
$.ajax({
url: '{{ url('admin/selectset') }}/'+encodeURI(id),
type: "GET",
dataType: "json",
success:function(result) {
result.sort(function(a,b) {
return (a.id > b.id) ? 1 : ((b.id > a.id) ? -1 : 0);
});
console.log(result);
//rest of code..
}
问题
即使我在控制台中通过ajax排序(如我在代码中看到的那样)返回我的数据,它也会正确返回,但在刀片中它会显示为它所希望的!
如果上面的图像不起作用here it is again
题
>我该如何解决这个排序问题?
更新
我将我的ajax代码更改为:
result.sort(function(a,b) {
return (a.sort > b.sort) ? 1 : ((b.sort > a.sort) ? -1 : 0);
});
和结果是一样的screenshot
解决方法:
根据您在评论中提供的链接:https://www.codepile.net/pile/RlQoa6Dk
您正在将数据附加到ajax响应的html上,请记住ajax是异步的,因此尽管您的ajax请求是按顺序进行的,但响应可能不会按顺序发生.
这就是为什么你总是得到随机订单……
你应该:
>做第一个ajax电话
>响应中的foreach元素,进行第二次ajax调用
>为响应中的每个元素附加计算的html
>一旦每个ajax调用终止,或者至少多个ajax调用来计算html,请订购原始响应,现在具有html.
>响应中的foreach元素,追加计算出的html
编辑
只需在执行ajax调用之前附加行即可.
<script defer>
$(document).ready(function() {
$('select[name="selectset"]').on('change', function() {
var id = $(this).val();
if(id) {
$.ajax({
url: '{{ url('admin/selectset') }}/'+encodeURI(id),
type: "GET",
dataType: "json",
success:function(result) {
$('div#dataaamsg').empty();
$('div#dataaamsg').append('Use <kbd>CTRL</kbd> or <kbd>SHIFT</kbd> button to select multiple options');
result.sort(function(a,b) {
return (a.sort > b.sort) ? 1 : ((b.sort > a.sort) ? -1 : 0);
});
$.each(result, function(key1, value1) {
var vvvid = value1.id;
if(value1['type'] == 'textfield'){
var my_row = $('<div class="row mt-20 ccin">');
$('div#dataaa').append(my_row);
}else if(value1['type'] == 'textareafield'){
var my_row = $('<div class="row mt-20 ccin">');
$('div#dataaa').append(my_row);
}else{
var my_row = $('<div class="row mt-20">');
$('div#dataaa').append(my_row);
}
// second data
$.ajax({
url: '{{ url('admin/findsubspecification') }}/'+value1['id'],
type: "GET",
dataType: "json",
success:function(data) {
// Check result isnt empty
var helpers = '';
$.each(data, function(key, value) {
helpers += '<option value="'+value.id+'">'+value.title+'</option>';
});
if(value1['type'] == 'textfield'){
var my_html = '{{ Form::open() }}<input name="product_id" id="product_id" type="hidden" value="{{$product->id}}"><input name="specification_id" id="specification_id" type="hidden" value="'+vvvid+'"><div class="col-md-4">'+value1.title+'</div>';
my_html += '<div class="col-md-6"><input id="text_dec" name="text_dec[]" placeholder="text field" class="text_dec form-control"></div>';
my_html += '<div class="col-md-2"><button type="button" id="custmodalsavee" class="custmodalsavee btn btn-xs btn-success">Save</button>{{Form::close()}}</div>';
my_row.html(my_html);
}else if(value1['type'] == 'textareafield'){
var my_html = '{{ Form::open() }}<input name="product_id" id="product_id" type="hidden" value="{{$product->id}}"><input name="specification_id" id="specification_id" type="hidden" value="'+vvvid+'"><div class="col-md-4">'+value1.title+'</div>';
my_html += '<div class="col-md-6"><textarea id="longtext_dec" name="longtext_dec[]" placeholder="text area field" class="longtext_dec form-control"></textarea></div>';
my_html += '<div class="col-md-2"><button type="button" id="custmodalsavee" class="custmodalsavee btn btn-xs btn-success">Save</button>{{Form::close()}}</div>';
my_row.html(my_html);
}else{
var my_html = '{{ Form::open() }}<input name="product_id" id="product_id" type="hidden" value="{{$product->id}}"><div class="col-md-4">'+value1.title+'</div>';
my_html += '<div class="col-md-6"><select class="subspecifications form-control tagsselector" id="subspecifications" name="subspecifications[]" multiple="multiple">'+helpers+'</select></div>';
my_html += '<div class="col-md-2"><button type="button" id="sendspacsdatato" class="sendspacsdatato btn btn-xs btn-success">Save</button>{{Form::close()}}</div>';
my_row.html(my_html);
}
}
});
// second data
});
}
});
}else{
$('div#dataaa').empty();
}
});
});
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。