如何在laravel 5.2中创建关系选择选项ajax [英] how to create relational select option ajax in laravel 5.2
问题描述
我们想用ajax创建一个关系选择选项.laravel 5.2.
We want to create a relational select option with ajax Receive data from mysql on laravel 5.2.
我们有三个选择选项:类型",品牌"和产品名称".
We have three select options: "type", "brand" and "product name".
选择类型时,应加载相关品牌,然后,选择品牌时,应在最后选择中加载相关产品名称.
When type is selected, the related brands should be loaded and after that, when a brand is selected, the related product names should be loaded in the last select.
推荐答案
我将尝试举例说明.
假设您有三个名为(国家,州,城市)的表,并假设您使用的是jQuery.
let's consider you have three tables named ( countries, states, cities ) and assume you are using jquery.
国家/地区:
id | name | code | **
--------------------------------
1 | united states | US | etc
状态:
id | country_id | name
--------------------------------
1 | 1 | Texas
城市:
id |state_id | name
--------------------------------
1 | 1 | Houston
因此您将拥有三个模型,最好分别命名为国家/地区",州/市"
so you will have three models preferably named as Country, State, City
我们需要两条路线来装载州和城市
we need two routes to load states and cities
Route::post( '/get/states', 'WorldController@states' )->name( 'loadStates' );
Route::post( '/get/cities', 'WorldController@cities' )->name( 'loadCities' );
,在我们的Controller(这里是WorldController)中,我们有两种方法:
and in our Controller ( here WorldController ) we have two methods :
function states( Request $request )
{
$this->validate( $request, [ 'id' => 'required|exists:countries,id' ] );
$states = State::where('country_id', $request->get('id') )->get();
//you can handle output in different ways, I just use a custom filled array. you may pluck data and directly output your data.
$output = [];
foreach( $states as $state )
{
$output[$state->id] = $state->name;
}
return $output;
}
function cities( Request $request )
{
$this->validate( $request, [ 'id' => 'required|exists:states,id' ] );
$cities = City::where('state_id', $request->get('id') )->get();
$output = [];
foreach( $cities as $city )
{
$output[$city->id] = $city->name;
}
return $output;
}
,我们将有以下三个选择选项:
and we will have three select options like this :
<select name="country" id="country">
@foreach( Country::get() as $country )
<option value="{{ $country->id }}">{{ $country->name }}</option>
@endforach
</select>
<select name="state" id="state"></option>
<select name="city" id="city"></option>
我们假设您正在使用jquery,所以我们会像这样更新我们的选择选项:
as we assumed you are using jquery we update our select options like this :
<script>
$(function(){
$('#country').change(function(){
$("#state option").remove();
$("#city option").remove();
var id = $(this).value();
$.ajax({
url : '{{ route( 'loadStates' ) }}',
data: {
"_token": "{{ csrf_token() }}",
"id": id
},
type: 'post',
dataType: 'json',
success: function( result )
{
$.each( result, function(k, v) {
$('#state').append($('<option>', {value:k, text:v}));
});
},
error: function()
{
//handle errors
alert('error...');
}
});
});
$('#state').change(function(){
$("#city option").remove();
var id = $(this).value();
$.ajax({
url : '{{ route( 'loadCities' ) }}',
data: {
"_token": "{{ csrf_token() }}",
"id": id
},
type: 'post',
dataType: 'json',
success: function( result )
{
$.each( result, function(k, v) {
$('#city').append($('<option>', {value:k, text:v}));
});
},
error: function()
{
//handle errors
alert('error...');
}
});
});
});
</script>
这篇关于如何在laravel 5.2中创建关系选择选项ajax的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!