html:
<div class="row cl" id="app">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>小区地址:</label>
<div class="formControls col-xs-8 col-sm-9">
<select name="fang_province" id="fang_province" style="width: 100px" onchange="selectCity(this,'fang_city')" class="input-text">
<option value="0">省</option>
@foreach($data['cityData'] as $val)
<option value="{{$val->id}}">{{$val->name}}</option>
@endforeach
</select>
<select name="fang_city" id="fang_city" style="width: 100px" onchange="selectCity(this,'fang_region')" class="input-text">
<option value="0">市</option>
</select>
<select name="fang_region" id="fang_region" style="width: 100px" class="input-text">
<option value="0">区</option>
</select>
</div>
</div>
js:
<script type="text/javascript">
function selectCity(obj,selectName) {
// 得到选中的省份
let value = $(obj).val();
// 以省份ID获得市级ID,发起ajax请求
$.get('{{route('admin.fang.sanJi')}}',{
id : value
}).then(jsonArr=>{
let html = '<option value="0">市</option>';
jsonArr.map(item=>{
var {id,name} = item;
html+=`<option value="${id}">${name}</option>`;
});
$('#'+selectName).html(html);
})
}<script/>
php:
public function sanJi(Request $request)
{
$data = City::where('pid',$request->get('id'))->get(['id','name']);
return $data;
}