私は本当にjquery.Wellに慣れていません.2つの入力テキストフィールドがあり、次の関数を介して両方の入力フィールドに自動提案リストを添付することができました.
function lookup(inputString,tableName,colName,divId,listId) {
if(inputString.length == 0) {
// Hide the suggestion box.
$(divId).hide();
} else {
$.post("customers.php", {queryString: ""+inputString+"",table:""+tableName+"",col:""+colName+""}, function(data){
if(data.length >0) {
$(divId).show();
$(listId).html(data);
}
});
}
} // lookup
私のフォームは次のようになります
<div>
<form>
<div>
Location
<br />
<input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value,'countries','value','#suggestions','#autoSuggestionsList');" onblur="fillValues(this.value,'#inputString','#suggestions');" autocomplete="off"/>
</div>
<div class="suggestionsBox" id="suggestions" style="display: none;">
<img src="http://localhost/ci/css/images/upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" />
<div class="suggestionList" id="autoSuggestionsList" >
</div>
</div>
<div>
Favourite Product
<br />
<input type="text" size="30" value="" id="inputString1" onkeyup="lookup(this.value,'product','value','#suggestions1','#autoSuggestionsList1');"
"fillValues(this.value,'#inputString1','#suggestions1');" autocomplete="off"/>
</div>
<div class="suggestionsBox" id="suggestions1" style="display: none;">
<img src="http://localhost/ci/css/images/upArrow.png" style="position: relative; top: -12px;left: 30px;" alt="upArrow" />
<div class="suggestionList" id="autoSuggestionsList1" >
</div>
</div>
</form>
</div>
そしてfillValues関数は次のようになります
function fillValues(thisVal,inputId,divId)
{
$(inputId).val(thisValue);
setTimeout("$("+divId+").hide();",200)
}
ユーザーがリストの値をクリックすると、入力テキストフィールドにその値が入力されます。しかし、それができません。何が欠けていますか?
ps 自動提案リストが正常に表示され、customers.php が正常に動作しています。