laravel 5.2动态下拉列表

时间:2016-04-30 13:06:21

标签: php mysql list laravel dropdown

我有一个活动,我想从艺术家表中添加艺术家。 我想通过使用下拉列表来完成这项工作,其中需要填写艺术家名称,并且他们是一个小的' +'在它旁边添加其他艺术家。在执行该操作时,应将第3个传递表作为外键插入事件ID和艺术家ID。 当我创建活动时

在我看来:

<div class="form-group">
<label for="task-artist" class="col-sm-3 control-label">Artist:</label>
<div class="col-sm-6">
   <select name="artist" id="artist" class="form-control input-sm">
    <option value=""></option>
      @foreach($artists as $artist)
          {{$artist->stage_name}} 
       @endforeach
    </select>
</div>
</div>

我的控制员:

public function index(Request $request)
    {
        return view('tasks.index', [
            'tasks' => $this->tasks->forUser($request->user()),
             'artists' => DB::table('artists')->pluck('stage_name', 'id'),
        ]);
    }

    public function show($id)
    {
        //Get results by targeting id
        $task = Task::find($id);
        //$artist = Artist::lists('stage_name', 'id');
        //$artist = Artist::where('active', true)->orderBy('stage_name')->pluck('stage_name', 'id');
        //
        return view('tasks.show')->with('task',$task);
    }

我该怎么办? 请帮忙。

1 个答案:

答案 0 :(得分:2)

Javascript是你的朋友。

让我写一些您可以遵循的步骤来实现您的目标:

1)有Div标签和

2)在javascript中使用$ .get()函数从控制器获取动态值。

3)$ .each()循环访问数据并在选择输入字段中显示

4)选择值或点击你提到的+按钮再做一次Javascript调用,将艺术家添加到活动中。

示例:

HTML
<div class="uk-margin-bottom">
    <div id="your select dropdown"></div>
</div>

JAVASCRIPT
$("#artist").change(function() {
    getArtists();
});

    function getArtist() {
    var artist= $('#your div id');
    artist.empty();
    var code = '';
    $.get("/url/" + variable_id, function(data) {
        artist.empty();
        console.log(data);// once you create route and controller you should see your artists lists here

        code += '<label for="event_id" class="uk-form-label">Select Artist</label><select class="uk-width-1-1" name="artist_name" id="artist_name" value="select">';
        code += '<option value="">Select Artists</option>';
        $.each(data.artist, function(index, value) {

            code += '<option value="' + value.artist_name+ '">' + value.artist_name + '</option>';
        });
        code += '</select>
        artist.append(code);

    });
}

有一个表单并添加javascript以将艺术家发布到控制器并将数据存储到事件表中。试着看看你是否能够实现并遵循我的步骤。