如何基于集合形式的下拉列表中的所选选项过滤模型集合？

Question

我正在做一个购物中心目录Web应用程序。 我想根据下拉列表选项显示一组租户列表。 （按区域/楼层/类别分组）

最初，我尝试通过路由将表单中的区域下拉列表的选定选项传递给DirectoryController，但我做不到。

<!-- Part of the View -->
<div class = "panel-body bg-light">
        {{ Form::open(array('route' => array('directory.group', '$tenants', 'zone_id'))) }}
        <div class = "container-fluid bg-default">
            <table class="table table-borderless">
                <thead>
                    <th scope="col"><strong>ZONE<strong></th>
                    <th scope="col"><strong>FLOOR<strong></th>
                    <th scope="col"><strong>CATEGORY<strong></th>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            <!-- Zone -->
                            <div>
                                {!! Form::select('zone_id',
                                    Zone::pluck('code', 'id'), null, [
                                        'class' => 'form-control',
                                        'placeholder' => '- Select Zone -',
                                        'onchange' => 'this.form.submit()'
                                    ] )
                                !!}
                            </div>
                        </td>
                        <td>
                            <!-- Floor -->
                            <div>
                                {!! Form::select('floor_id',
                                    Floor::pluck('code', 'id'), null, [
                                        'class' => 'form-control',
                                        'placeholder' => '- Select Zone -',
                                ]) !!}
                            </div>
                        </td>
                        <td>
                            <!-- Category -->
                            <div>
                                {!! Form::select('category_id',
                                    Category::pluck('name', 'id'), null, [
                                        'class' => 'form-control',
                                        'placeholder' => '- Select Zone -',
                                ]) !!}
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>

        </div>

    {!! Form::close() !!}
</div>

DirectoryController

/**
 * Show the application dashboard.
 * @param array $tenants
 * @param int $zone_id
 *
 * @return \Illuminate\Http\Response
 */
public function group($tenants, $zone_id)
{
    $tenants = $tenants->where('zone_id', $zone_id);

    return view('directory.index', [
        'tenants' => $tenants,
    ]);

}

我的概念是将租户列表传递给DiretoryController @ group，该函数将根据下拉列表的选定选项进行过滤，并将新的租户列表传递回视图并显示。

如果有任何建议或解决方案，我将不胜感激。

Answer 1

您可以绑定onchange以选择并在每个更改事件上调用ajax。

  $(document).ready(function () {
        $('#zone_id').on('change',function () {
            var id = this.value;
            $.ajax({
                type: 'GET',
                url: 'url',
                data: {
                    id:id
                },
                dataType: 'json',
                success: function (json) {
                    $('#zone_id').html(' ');
                    $.each(json, function(i, value) {
                        $('#zone_id').append($('<option>').text(value).attr('value', i));
                    });
                }
            });
        });
    });

Answer 2

表单中的值不会作为参数传递给控制器​​方法，您将需要使用Request类表单。您可以使用request()辅助函数：

request()->input('zone_id');

或

Dependency injection

public function group(\Illuminate\Http\Request $request, $tenants)
{
    $tenants = $tenants->where('zone_id', $request->input('zone_id'));

    return view('directory.index', [
        'tenants' => $tenants,
    ]);

}