html - laravel 和 jquery 中的自动完成搜索框问题
问题描述
我正在使用 laravel 和 jquery 制作自动完成搜索框,但它无法正常工作,并且在$( "#keyword" ).autocomplete({
和response( data );
我不知道为什么会发生这种情况,而且它也没有创建响应下拉
Uncaught TypeError: Cannot read property 'element' of undefined
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
$(document).ready(function(){
$("#keyword").keypress(function(){
$( "#keyword" ).autocomplete({
source: function( request, response ) {
$.ajax({
url:"{{route('translations.get_translation_data')}}",
type: 'post',
dataType: "json",
data: {
_token: CSRF_TOKEN,
search: request.term
},
success: function( data ) {
response( data );
}
});
},
select: function (event, ui) {
$('#keyword').val(ui.item.en_text); // display the selected text
return false;
}
});
});
});
<script src="https://code.jquery.com/jquery-2.1.4.js"
integrity="sha256-siFczlgw4jULnUICcdm9gjQPZkw/YPDqhQ9+nAOScE4="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/raty/2.9.0/jquery.raty.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-autocomplete/1.0.7/jquery.auto-complete.css" rel="Stylesheet"></link>
<script src="https://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<input type="text" name="keyword" id="keyword" placeholder="Quick Search" value=""/>
Route::post('/translations/get_translation_data', 'Admin\TranslationController@get_translation_data')->name('translations.get_translation_data');
function get_translation_data(Translation $translation,Request $request){
$search = $request->search;
$language = Session::get('language');
$lang_id = $language['id'];//$request->input('lang');
$translations = $translation;
if($lang_id!=''){
$translations = $translations->with('language')->where("language_id",$lang_id);
}
$en_translations = $translation->where("language_id",1)->get();
if(!empty($search)){
$en_translations = $translation->orderby('en_text','asc')->select('en_text')->where('en_text', 'like', '%' .$search . '%')->get();
}else{
$en_translations = $translation->orderby('en_text','asc')->select('en_text')->get();
}
return $en_translations;
//it is giving result like
//[{"en_text":"Abc"},{"en_text":"Allot"}]
}
有人可以帮我吗?
解决方案
推荐阅读
- oracle - 如何重置 Oracle 优化以测试 proc 更改
- java - Spring Boot Redis 缓存创建许多新的 Redis 连接
- javascript - 如何抓取网页内容,就像 importxml 公式对 Google Apps 脚本所做的那样?
- c# - 如何在“if”语句之后结束脚本
- c# - 无法在 MacOS 上构建 Puppeteer-Sharp,2021 年 1 月
- python - Python 和 ANSI 转义字符
- python - Python创建目录错误当该文件已存在时无法创建文件
- azure - 通过 Microsoft Graph 数据连接或内容搜索或其他方式进行就地存档访问
- javascript - 在 JavaScript 中以换行符返回值
- ios - 在哪里存储具有字符串属性的对象?