使用 laravel 5 动态下拉插入状态名称

Question

嗨，我使用dynamic drop down 表示州和城市，当我在插入州 ID 进入数据库后从下拉列表中选择州和城市时，我想插入州名而不是 ID。如果我从(option value=id) 中删除 id 动态下拉菜单不起作用...请建议我

这是我的刀片模板：

<form method="POST" action="{{URL::to('test/insert')}}">  
    <input type="hidden" name="_token" value="{{csrf_token()}}"/>
    <select name="state" id="state" class="form-control input-sm">
        @foreach($states $state)
            <option value="{{$state->id}}">{{$state->name}}</option>
        @endforeach
    </select>

    <select id="city" class="form-control input-sm" name="city">
        <option value=""></option>
    </select>
    <input type="submit" name="submit">
</form>

<script>
    $('#state').on('change',function(e){
        console.log(e);
        var state_id = e.target.value;
        $.get('city?state_id=' + state_id, function(data){
        $('#city').empty();
        $.each(data,function(index,subcatObj){
            $('#city').append('<option value="'+subcatObj.name+'">'+subcatObj.name+'</option>');
        });
    });
});
</script>

这是我的控制器：

public function state()
{
    $states=DB::table('states')->get();
    return View::make('index')->with('states',$states);
}

public function city()
{
    $state_id=Input::get('state_id');
    $cities=DB::table('towns')->where('state_id','=', $state_id )->get();
    return Response::json($cities);
} 

这是我的插入州和城市控制器：

public function insert() {
    $s_name=array('state'   => Input::get('state'),
                  'city'    => Input::get('city'));
    DB::table('test')->insert( $s_name);
}

Answer 1

首先，您可以将 select 更新为类似的内容（即添加 data-id 属性）：

@foreach($states $state)
    <option value="{{$state->name}}" data-id="{{$state->id}}">{{$state->name}}</option>
@endforeach

然后，将您的 JavaScript 函数更新为（即选择新的 data-id 属性以从 ajax 获取城市）：

$('#state').on('change',function(e){
    console.log(e);
    var state_id = $(this).attr('data-id');
    $.get('city?state_id=' + state_id, function(data){
    $('#city').empty();
        $.each(data,function(index,subcatObj){
            $('#city').append('<option value="'+subcatObj.name+'">'+subcatObj.name+'</option>');
        });
    });
});

然后，提交表单应该给您州名而不是 ID。