我想使用按下键时从数据库中获取的数据。我试过了，但是没用。
$('#QTag').keyup(function (event) {
let tags = [];
$.ajax({
type: 'POST',
url: '/tryauto',
data: {
'key': $(this).val()
},
success: function (dataDB) {
$.each(dataDB,function (index,value) {
tags.push(value);
});
$('input.autocomplete').autocomplete({
data: tags
});
}
});
});
我也试过$('input.autocomplete').autocomplete('updateData',tags);了，但是也没用。
--
这是我的Laravel控制器
public function denemeauto(Request $request){
$tags = $request->get('key');
return DB::table('tags')->where('tag_title', 'LIKE', $tags . '%')->get();
}
好的，这是我初步尝试解决此问题。https://codepen.io/tuffant21/pen/KKpBapd我注意到的第一件事是您正在使用自动完成数组。请注意，自动完成功能需要对象，而不是数组。
其次，您需要在页面加载时初始化自动完成功能。然后使用来更新实例中的数据对象instance.options.data。$（'＃QTag'）。keyup（）...必须位于$（document）.ready（）...函数内部。
最后，由于最初加载时没有任何数据，因此会延迟一段时间才能显示任何自动完成信息。您将需要输入文字，稍等片刻然后继续输入。使用这种当前方法，您将遇到该问题，每次按键时都会在后台下载数据并替换旧数据。
让我知道如果您需要更多说明或帮助，我还能如何澄清这一点！
// make sure you load jquery before materialize
$(document).ready(function(){
$('input.autocomplete').autocomplete({
data: {foo: 'bar'}
});
$('#QTag').keyup(function (event) {
const instance = M.Autocomplete.getInstance(document.getElementById('QTag'));
// autocomplete expects an object, not an array
// let tags = []; before
let tags = {}; // after
// mimic api call
setTimeout(() => {
const dataDB = [
{tag_id:'12',tag_title:'love',tag_link:'love'}
];
$.each(dataDB, function (index, value) {
// since it is an object, don't use push
// tags.push(value); before
tags[value.tag_title] = value.tag_id; // after
});
instance.options.data = tags;
}, 500);
});
});<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<div class="row">
<div class="col s12">
<div class="row">
<div class="input-field col s12">
<input id="QTag" type="text" id="autocomplete-input" class="autocomplete">
<label for="autocomplete-input">Autocomplete</label>
</div>
</div>
</div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句