javascript - Laravel AJAX - 记住多个选择的过滤器

Question

过去几周我一直在努力解决这个问题。我不能只顾着解决这个问题。

在我的网页上，我总共有四个过滤器:一次搜索、按年份过滤、按启动站点过滤和按国家/地区过滤。这些过滤器本身可以完美工作。他们设法快速过滤我的数据库并返回我需要的结果。

问题在于，如果应用一个过滤器然后决定应用另一个过滤器，则会重置第一个过滤器。我正在进行的 AJAX 调用根本无法记住我应用的第一个过滤器是什么。从我的研究中，我发现我需要以某种方式保存用户选择的过滤器并通过按钮或其他东西应用它们。我认为这将是实现这一点的最简单的方法。

基本上，我们想要实现的是允许用户选择多个过滤器，而不需要重置第一个过滤器。

这是我当前用于 AJAX 调用的代码:

$(document).ready(function() {
  $('#filter-type').select2();
  $('#filter-year').select2();
  $('#filter-pad').select2();
  $('#search').on('keyup', function() {
    $value = $(this).val();
    delay(function() {
      if ('#search'.length > 3) {
        $.ajax({
          type: 'get',
          url: '{{$operatorname->spadoc_cd}}',
          data: {
            'search': $value
          },
          success: function(data) {
            $('#data-holder').html(data);
          }
        });
      }
    }, 300);
  });
  $("#filter-pad").change(function() {
    $value = $(this).val();
    $.ajax({
      type: "get",
      url: "{{$operatorname->spadoc_cd}}",
      data: {
        'search': $value,
        type: 'site'
      },
      success: function(data) {
        $('#data-holder').html(data);
      }
    });
  });
  $("#filter-type").change(function() {
    $value = $(this).val();
    $.ajax({
      type: "get",
      url: "{{$operatorname->spadoc_cd}}",
      data: {
        'search': $value,
        type: 'object_type'
      },
      success: function(data) {
        $('#data-holder').html(data);
      }
    });
  });
  $("#filter-year").change(function() {
    $value = $(this).val();
    $.ajax({
      type: "get",
      url: "{{$operatorname->spadoc_cd}}",
      data: {
        'search': $value,
        type: 'launch_year'
      },
      success: function(data) {
        $('#data-holder').html(data);
      }
    });
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

if ($request->ajax())
    {
        $output="";
        $operatorsatellite = DB::table('satellites')
            ->where(function($q) use ($request) {
                if(empty($request->type) && empty($request->rocket_type)) {
                    $q->orWhere('satname','LIKE','%'.$request->search.'%')
                        ->orWhere('norad_cat_id','LIKE','%'.$request->search.'%')
                        ->orWhere('country','LIKE','%'.$request->search.'%')
                        ->orWhere('object_id','LIKE','%'.$request->search.'%');
                } else {
                    if(!empty($request->type)) {
                        $q->orWhere($request->type,'LIKE','%'.$request->search.'%');
                    }
                    if(!empty($request->site)) {
                        $q->orWhere('site','LIKE','%'.$request->site.'%');
                    }
                    if(!empty($request->object_type)) {
                        $q->orWhere('object_type','LIKE','%'.$request->object_type.'%');
                    }
                    if(!empty($request->launch_year)) {
                        $q->orWhere('launch','LIKE','%'.$request->launch_year.'%');
                    }
                }
            })
            ->where('country', $spadoc_cd)->Paginate(700);
        if ($operatorsatellite)
        {
            foreach ($operatorsatellite as $key => $operatorsatellites) {
            $output .='<div class="table-row" id="launchsatdisplay">'.
                    '<div class="satname">'.'<a href=/satellite/'."$operatorsatellites->norad_cat_id".'>'.$operatorsatellites->satname.'</a>'.'</div>'.
                    '<div>'.'<div class="satnumbers">'.'<span>'.$operatorsatellites->norad_cat_id.'</span>'.'<span>'.$operatorsatellites->object_id.'</span>'.'</div>'.'</div>'.
                    '<div>'.$operatorsatellites->object_type.'</div>'.
                    '</div>';
            }
        }
        return $output;
    }
    else {
        $operatorsatellite = DB::table('satellites')->Paginate(50);
        return view('pages/operator-filter', compact('operators', 'operatorsatellite', 'searchsite', 'searchyear', 'searchtype'));
    }

Answer 1

我更新了我的答案，因为这不是最好的方法，而且根本不正确。首先，您可以在 GET 数据中发送过滤器(在您的情况下，使用 session 会更明智)，在 ajax 调用中添加过滤器作为参数(如果选择或输入了它们，取决于您的输入)类似这样

data: {
   'filter-1': $('.myInput1').val(), // take value from filter 1 and send them as get params
   'filter-2': $('.myInput2').val(), // take value from filter 2 and send them as get params
   // ...........
}

所以你的网址应该像这样 mydomain.me/myurl?search=someValue?filter-1=somevalue1&filter-2=somevalue2

如果您想在每次选择更改时更新数据，也可以从其他过滤器中获取值，这样它们就不会丢失，例如

 $("#filter-type").change(function() {
$value = $(this).val();
$value2 = $('otherFilter2').val();
$value3 = $('otherFilter3').val();
$.ajax({
  type: "get",
  url: "{{$operatorname->spadoc_cd}}",
  data: {
    'search': $value,
    'filter2' $value2,
    'filter3' $value3,
  // other code ....

因此，您可以从此网址获取过滤器并在查询中使用它们。

然后检查您的 php 代码中是否存在该值

if(!empty($request->filter-1)) {
   $q->orWhere('someData','LIKE','%'.$request->filter1.'%');
}

并对其他人做同样的事情。当然你可以使用 session ，但这样做没有意义，以 GET 参数发送数据会更容易、更好