我在返回 json 数据并在 laravel
中对它们进行排序
时遇到问题,它们只是随机出现。
到目前为止我做了什么
我试图通过他们的
id
从数据库中返回数据并得到帮助 像这样的 JavaScript:result.sort(函数(a,b) { 返回(a.id > b.id)? 1 : ((b.id > a.id) ? -1 : 0); });
结果是随机顺序(排序)我在我的数据库中添加了
sort
列,并尝试根据我在那里提供的数字获取我的数据库(结果是随机排序)我尝试在我的函数代码中添加
->orderByRaw('set_specification.sort')
并以此获取订单(结果是随机订单)
逻辑
- 我选择一个
集合
Set
child 将按sort
列顺序出现在 Blade 上,我 在其中提供数字。
代码
Controller
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 排序(如您在我的代码中所见)返回我的数据,它也会正确返回,但在 blade 中它会如愿以偿!
万一上面的图片不起作用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 调用,或者至少终止计算 html 的多个 ajax 调用,对现在具有 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>
关于javascript - Laravel 按排序返回数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52067992/