具有 Laravel 实现的动态 Ajax 过滤器

Question

我正在尝试为电子商务创建侧边栏过滤器。我已经成功实现了无限滚动分页，但现在我遇到了过滤器问题。

    <ul class="check-box-list">
      <?php $m = 1; ?>
        @foreach($marchi as $marchio)
          <li>
           <input type="checkbox" id="m{{$m}}" class="marchio" name="{{ $marchio->id_produttore }}" data-marchio="{{ $marchio->brand->nome}}" value="{{ $marchio->brand->nome }}" />
          <label for="m{{$m}}">
            <span class="button"></span>
               {{ $marchio->id_produttore }}<span class="count">({{ $marchio->total }})</span>
            </label>   
     </li>
 <?php $m++; ?>
     @endforeach   
 </ul>

上面的复选框是动态生成的。如果我点击其中一个，我可以使用这个 js 触发正确的值：

<script type="text/javascript">
$('.marchio').on('click', function() {
      var marchio = $('.marchio:checked').val();
      $.ajax(
        {
            url: '?marchio=' + marchio,
            type: "get",
            beforeSend: function()
            {
                $('.ajax-load').show();
            }
        })
        .done(function(data)
        {
            if(data.html == " "){
                $('.ajax-load').html("No more records found");
                return;
            }
            $('.ajax-load').hide();
            $("#post-data").append(data.html);
        })
        .fail(function(jqXHR, ajaxOptions, thrownError)
        {
              alert('server not responding...');
        });
});

但是如果我单击第二个复选框，附加到 ajax url 的值将保持不变，如果我取消选中第一个则剩下第二个。我需要将同一复选框 class 的多个值附加到 url，从而将其传递给 url。如果某些类别可以有多个过滤器，我需要 ajax url 可以接受不同的查询字符串，例如在我们单击复选框后附加“，”分隔值。有人能帮我吗？

Answer 1

在您的 ajax 调用中，您可以执行如下操作：

$('.marchio').on('click', function () {
    var marchi = {};

    $('.marchio:checked').each(function () {
        marchi[$(this).attr('name')] = $(this).val();
    });

    $.ajax({
        url: '',
        type: 'get',

        // This is the important part!
        data: {marchi: marchi}
    })
});

这将发送如下请求：

http://example.com/?marchi[name1]=value1&marchi[name2]=value2

在PHP中，这只是转换成一个数组，所以你可以简单地在你的控制器中这样做：

foreach (Request::get('marchi') as $id_produttore => $brandNome) {
    // This marchio has been selected.
}

如果您想传递更多的值，只需将更多值添加到 $.ajax 调用的 data 属性即可。

具有 Laravel 实现的动态 Ajax 过滤器

Dynamic Ajax filter with Laravel implementation

ajax

jquery

laravel

laravel-5.1