根据下拉选项自动填充文本框(Laravel和Javascript帮助!)

时间:2016-03-10 17:44:28

标签: javascript php laravel

我希望自动填充页面中的一些文本框,具体取决于用户从同一页面上的下拉菜单中选择的内容。

因此,如果用户进行选择,则从数据库中自动填充相关信息。然后,如果用户更改选择,则动态更新并更改文本框中的信息以匹配选择。

到目前为止,我所能做的就是显示一些数据库文本,如果我对选择进行硬编码(当然这只是显示相同的事情而不是用户所做的事情)。

假设我从我的数据库中名为info_description的特定字段中提取一些信息:

$fill = \DB::table('tbl_information')->where('id', 1)->pluck('info_description');

传递给blade.php文件,如下所示:

return view('pages.information')
        ->with('fill', $fill);

我的blade.php文件中有以下内容

<div class="form-group">
    <label class="col-md-4 control-label">app method</label>
    <div class="col-md-6 input-group-sm">
        {!! Form::text('text', $fill) !!}
    </div>
</div>

我想我需要一些JavaScript来帮助我,但我完全迷失了如何去做。如果有人可以指导我,我真的可以使用一些帮助和方向。

我该如何做到这一点?

1 个答案:

答案 0 :(得分:1)

这应该会让你有个先机。

route.php

Route::get('/infos/{id}', 'InfoController@getInfo');

<强> InfoController.php

public function getInfo($id)
{
  $fill = \DB::table('tbl_information')->where('id', $id)->pluck('info_description');

  return Response::json(['success'=>true, 'info'=>$fill]);
}

<强> app.js

$("#info_id").change(function() {
  $.ajax({
    url: '/info/' + $(this).val(),
    type: 'get',
    data: {},
    success: function(data) {
      if (data.success == true) {
        $("#info_id").value = data.info;
      } else {
        alert('Cannot find info');
      }

    },
    error: function(jqXHR, textStatus, errorThrown) {}
  });
});

<强> HTML

<select name="info_id" id="info_id">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>
<textarea name="info_area" id="info_area" cols="30" rows="10"></textarea>