php - 根据 laravel 中选定的省份获取城市列表

Question

如何获取基于所选省份的城市列表？

我的 Controller :

public function index() {
        $province = RajaOngkir::Provinsi()->all();
        $city = RajaOngkir::kota()->all();
        return view('welcome', compact('province', 'city'));
    }

我的 Blade :

<div>
    <select name="province" id="">
        <option class="form-control" value="">Select Province</option>
        @foreach ($province as $info)
        <option value="{{ $info['province_id'] }}">{{ $info['province'] }}</option>
        @endforeach
    </select>

    <select name="city" id="">
        <option class="form-control" value="">Select City</option>
        @foreach ($city as $info)
        <option value="{{ $info['city_id'] }}">{{ $info['city_name'] }}</option>
        @endforeach
    </select>
</div>

截图:

PS:我的数据来自第三方网站，我的数据库中没有数据，包括country province city等。因为我不幸的是，有人向其他问题和网站建议了这些解决方案，这些解决方案对我不起作用。

更新

我的 Controller :

public function index() {
        $province = RajaOngkir::Provinsi()->all();
        $city = RajaOngkir::kota()->all();
        return view('welcome', compact('province', 'city'));
    }

    public function getCityList($province_id)
    {
        $city = RajaOngkir::kota()->all()->where("province_id",$province_id)->get();
        return response()->json($city);
    }

我的路线:

Route::get('/', 'rajaongkirController@index');
Route::get('/get-city-list/{province_id}','rajaongkirController@getCityList');

我的 View ( Blade :

<div class="col-md-6">
                    <select name="province" id="province">
                        <option class="form-control" value="">Select Province</option>
                        @foreach ($province as $info)
                        <option value="{{ $info['province_id'] }}">{{ $info['province'] }}</option>
                        @endforeach
                    </select>

                    <select name="city" id="">
                        <option class="form-control" value="">Select City</option>
                    </select>
                </div>

<script type="text/javascript">
            $(document).ready(function() {
            $('select[name="province"]').on('change', function() {
                var provinceID = $(this).val();
                    if(provinceID) {
                    $.ajax({
                        url: '/get-city-list/'+encodeURI(provinceID),
                        type: "GET",
                        dataType: "json",
                        success:function(data) {
                        $('select[name="city"]').empty();
                        $.each(data, function(key, value) {
                            $('select[name="city"]').append('<option value="'+ value +'">'+ value +'</option>');
                            });
                        }
                    });
                    }else{
                    $('select[name="city"]').empty();
                      }
                   });
                });
        </script>

Answer 1

首先，将 Controller 索引函数更改为此 -

public function index() {
    $province = RajaOngkir::Provinsi()->all();
    return view('welcome', compact('province'));
}

其次，使用选定的 $province_id 作为 @rahulsm's 链接进行 onchange() ajax 函数调用。您调用的 Controller 函数可以是-

public function getCityList($province_id)
{
    $city = RajaOngkir::kota()->where("province_id",$province_id)->get();

    return response()->json($city);
}

你的 url 路由文件可能是 -

Route::get('api/get-city-list/{province_id}','APIController@getCityList');

在你看来删除这个-

<select name="city" id="">
    <option class="form-control" value="">Select City</option>
    @foreach ($city as $info)
    <option value="{{ $info['city_id'] }}">{{ $info['city_name'] }}</option>
    @endforeach
</select>

为此并用ajax请求/数据填充此数据。

<select name="city" id="">
    <option class="form-control" value="">Select City</option>
</select>