Laravel按排序返回数据 [英] Laravel return data by sort

查看:72
本文介绍了Laravel按排序返回数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在 laravel 中返回json数据和 sort 时遇到问题,它们只是随机出现。

I have problem to returning json data and sort them in laravel, they just appear randomly.


  1. 我试图通过他们的<返回数据code> id 来自数据库和
    的帮助JavaScript如:

  1. I tried to return data by their id from database and help of JavaScript like:

result.sort(函数(a,b){
return(a.id> b.id)?1:((b.id> a.id)? - 1:0);
});

结果是随机顺序(排序)

result.sort(function(a,b) { return (a.id > b.id) ? 1 : ((b.id > a.id) ? -1 : 0); }); Result was random order (sort)

我添加了 sort 列到我的数据库并尝试获取我在那里提供的数据的数据(结果是随机顺序)

I added sort column to my database and tried to get my data base on numbers I provided there (result was random order)

我试图添加 - > orderByRaw('set_specification.sort')在我的功能代码中获取订单(结果是随机顺序)

I tried to add ->orderByRaw('set_specification.sort') in my function code and get orders by that (result was random order)



逻辑



Logic


  1. 我选择设置

  2. 设置将通过 sort 列顺序在刀片上显示子项我
    提供数字它。

  1. I select a set
  2. Set child's will appear on blade by sort column order which I provide numbers in it.



代码



控制器

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排序(如我在代码中看到的那样)返回我的数据时,它会正确返回,但是在刀片中它会按照它的意愿显示!

Issues

Even when I return my data by help of ajax sort (as you see in my code) in console it returns correctly but in blade it appears as it wish!

以上图片不起作用这里又是


  1. 如何修复此排序问题?



更新



我将我的ajax代码更改为:

Update

I changed my ajax code to:

result.sort(function(a,b) {
  return (a.sort > b.sort) ? 1 : ((b.sort > a.sort) ? -1 : 0);
});

且结果相同屏幕截图

推荐答案

根据您在评论中提供的链接: https://www.codepile.net/pile/RlQoa6Dk

According to the link you provided in the comments: https://www.codepile.net/pile/RlQoa6Dk

您正在将数据附加到ajax响应的html上,请记住ajax是异步的,因此尽管您的ajax请求是按顺序发出的,但响应可能不会按顺序发生。

You are appending the data to the html on the ajax response, remember that ajax is asynchronous, so although your ajax requests are made in order, the responses might not happen in that order.

这就是为什么你总是得到随机订单...

Thats why you always get random orders...

你应该:


  1. 做第一个ajax调用

  2. 响应中的foreach元素,进行第二次ajax调用

  3. 追加为响应中的每个元素计算html

  4. 一旦每个ajax调用终止,或者至少多个ajax调用来计算html,请订购原始响应现在有了html。

  5. 响应中的foreach元素,附加计算的html

  1. Do the first ajax call
  2. foreach element in the response, make the second ajax call
  3. append the calculated html for each element in the response
  4. Once every ajax call is terminated, or at least the multiple ajax calls to calculate the html, order the original response which by now has the html.
  5. foreach element in the response, append the calculated html

编辑

只需在执行ajax调用之前附加该行即可。

Just appending the row before doing the ajax call worked.

<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>

这篇关于Laravel按排序返回数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆