Question

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

    <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来将相同复选框类的多个值传递给url。如果某些类别可以有多个过滤器，我需要ajax url可以接受不同的`querystryngs，例如通过在我们点击复选框后附加'，'分隔值。有人能帮我吗？

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

如果您想传递更多值，只需在data来电的$.ajax属性中添加更多内容即可。

Answer 2

我认为如果你在循环外创建一个表单并将所有复选框传递给控制器作为一个像这样命名的数组（name =“list []”）

会更容易

<form action='{{route('someRoute)}}' method='post'>
    {{csrf_field()}}
    <ul class="check-box-list">
      <?php $m = 1; ?>
        @foreach($marchi as $marchio)
          <li>
           <input type="checkbox" id="m{{$m}}" class="marchio" name="list[]" 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>
</form>

在控制器中，您可以非常轻松地遍历结果

public function controllerName(Request $data)
{
  $vars=$data->input('list');
  foreach($vars as $var){
     // do somnthing
  }
}

使用Laravel实现的动态Ajax过滤器

2 个答案: