jquery mobile を使用してテキストを作成し、オートコンプリートしました。リモートサーバーからデータを取得することはできますが、問題は、リストをクリックすると、リストからアイテムを選択したときにリストがクリックされていることだけが表示されることです。選択したアイテムは入力フィールドとリストに配置する必要があります隠れるべきです。誰でもこれを行う方法を教えてもらえますか
?
<input type="text" id="searchTermInput" placeholder="enter project name"/>
<ul id="autocomplete" data-role="listview" data-inset="true"
data-theme="b" data-mini="true"></ul>
リモートサーバーからデータを取得するためのコードは次のとおりです。
$(document).ready(function(){
$('#searchTermInput').on('input',function(e){
var $itemList=$('#autocomplete');
$itemList.empty();
var $inputElem=$(this);
//triget only when at least 2 characters have been entered
var keywords = $inputElem.val();
if(keywords.length<2){
return;
}
$.ajax({
url:"link of the url file",
type:"POST",
data:{projectName:keywords},
dataType:"json",
context:{responseCallback: $itemList},
timeout:3000,
success:function(data,status,xhr){
if(data.length>0){
var listItemHtml="";
$.each(data,function(i,val){
listItemHtml +="<li><a href='#'>"+val.project_name+"</a><?li>";
});
$('#autocomplete').html(listItemHtml);
$('#autocomplete').listview("refresh");
}
}, error: function (xhr, status, err) {
alert(err);
}
});
});
});