laravel | Typeahead:如何组合数据库字段以进行显示并获取所选记录的 ID?
laravel | Typeahead : How to combine db fields for display and get selected record's id?
我正在尝试在我的 laravel 5.4
项目中实现自动完成功能,到目前为止,我已经成功地只显示了一个数据库字段(名字)。这是代码
路线
Route::get('test',array('as'=>'search','uses'=>'SearchController@search'));
Route::get('autocomplete',array('as'=>'autocomplete','uses'=>'SearchController@autocomplete'));
控制器
public function autocomplete(Request $request)
{
$data = customer::select("first_name as name")->where("first_name","LIKE","%{$request->input('query')}%")->orderBy('first_name')->take(6)->get();
return response()->json($data);
}
查看
<form method="POST" action="/home/customer/{{$id}}">
{{ csrf_field() }}
<div class="input-group input-medium " style="float: right; padding-top: 3px; padding-right: 15px; ">
<input type="text" class="typeahead form-control" required>
<span class="input-group-btn">
<button class="btn green-haze" type="submit"> <i class="fa fa-search"></i></button>
</span>
</form>
//js
<script type="text/javascript">
var path = "{{ route('autocomplete') }}";
$('input.typeahead').typeahead({
source: function (query, process) {
return $.get(path, { query: query }, function (data) {
return process(data);
});
}
});
</script>
所以我有两个弄清楚两件事:
以上代码目前仅显示 first_name 作为自动完成建议
我希望它们的格式为 id - first_name last_name
我还想从自动完成中获取选定的用户 ID,以便我可以将其传递到我的表单操作中 /home/customer/{$id}
我是 javascript 和 jquery 的新手,所以我还不知道如何操作。请帮助我
你只得到 first_name
的原因是因为你只 select 名字 select("first_name as name")
,从查询中删除 select你将返回一个包含所有字段的集合
例如
$data = customer::where("first_name","LIKE","%{$request->input('query')}%")->orderBy('first_name')->take(6)->get();
然后在您的 javascript 回调中,data
将有权访问找到的每条记录及其字段。
编辑
使用 Typeahead,您可以定义一个回调,以便您可以使用返回的数据,例如:
$('input.typeahead').typeahead({
source: {
groupName: {
// Ajax Request
ajax: {
url: "{{ route('autocomplete') }}"
}
}
},
callback: {
onResult: function (node, query, result, resultCount, resultCountPerGroup) {
console.log(node, query, result, resultCount, resultCountPerGroup);
}
}
});
我正在尝试在我的 laravel 5.4
项目中实现自动完成功能,到目前为止,我已经成功地只显示了一个数据库字段(名字)。这是代码
路线
Route::get('test',array('as'=>'search','uses'=>'SearchController@search'));
Route::get('autocomplete',array('as'=>'autocomplete','uses'=>'SearchController@autocomplete'));
控制器
public function autocomplete(Request $request)
{
$data = customer::select("first_name as name")->where("first_name","LIKE","%{$request->input('query')}%")->orderBy('first_name')->take(6)->get();
return response()->json($data);
}
查看
<form method="POST" action="/home/customer/{{$id}}">
{{ csrf_field() }}
<div class="input-group input-medium " style="float: right; padding-top: 3px; padding-right: 15px; ">
<input type="text" class="typeahead form-control" required>
<span class="input-group-btn">
<button class="btn green-haze" type="submit"> <i class="fa fa-search"></i></button>
</span>
</form>
//js
<script type="text/javascript">
var path = "{{ route('autocomplete') }}";
$('input.typeahead').typeahead({
source: function (query, process) {
return $.get(path, { query: query }, function (data) {
return process(data);
});
}
});
</script>
所以我有两个弄清楚两件事:
以上代码目前仅显示 first_name 作为自动完成建议 我希望它们的格式为
id - first_name last_name
我还想从自动完成中获取选定的用户 ID,以便我可以将其传递到我的表单操作中
/home/customer/{$id}
我是 javascript 和 jquery 的新手,所以我还不知道如何操作。请帮助我
你只得到 first_name
的原因是因为你只 select 名字 select("first_name as name")
,从查询中删除 select你将返回一个包含所有字段的集合
例如
$data = customer::where("first_name","LIKE","%{$request->input('query')}%")->orderBy('first_name')->take(6)->get();
然后在您的 javascript 回调中,data
将有权访问找到的每条记录及其字段。
编辑
使用 Typeahead,您可以定义一个回调,以便您可以使用返回的数据,例如:
$('input.typeahead').typeahead({
source: {
groupName: {
// Ajax Request
ajax: {
url: "{{ route('autocomplete') }}"
}
}
},
callback: {
onResult: function (node, query, result, resultCount, resultCountPerGroup) {
console.log(node, query, result, resultCount, resultCountPerGroup);
}
}
});