jQuery Autosuggestを使用すると、ユーザーは部品番号の入力を開始でき、同様の部品のリストを自動提示することができます。部品が選択されると、その部品番号の横にあるテキストボックスに説明が表示されます。部品番号と説明がCFCから戻ってきていますが、部品説明テキストボックスに部品説明を表示することができません。これどうやってするの?テキストボックスに値をバインド
jQueryを使ってフォーム:
<form action="index.cfm?action=reports:part.test" method="post">
<fieldset>
<legend>test</legend>
<p>Start typing a part number.</p>
<p>
<label for="partnum">Part Number: </label>
<input type="text" id="partnum" name="partnum" />
<input readonly="readonly" type="text" id="partdescription" name="partdescription" />
</p>
<p>
<input type="submit" name="submit" value="Submit" />
</p>
</fieldset>
</form>
<cfsavecontent variable="datatables_definitions">
<!-- added by user.list -->
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
$(document).ready(function(){
$('#partnum').autocomplete(
{source: function(request, response) {
$.ajax({
url: "/reports/services/remote/partSuggest.cfc?method=lookUpPart&returnformat=json",
dataType: "json",
data: {
search: request.term,
maxRows: 10
},
success: function(data) {
response(data);
$('#partdescription').val(partdescription);
},
})
},
parse: function(data){
return $.map(data, function(item) {
return { data: item, value: item, result: item };
});
}
});
});
</SCRIPT>
</cfsavecontent>
<cfhtmlhead text="#datatables_definitions#" />
CFCがクエリを実行:
再び<cfcomponent output="false">
<cffunction name="lookUpPart" access="remote" returntype="any" >
<cfargument name="search" type="any" required="false" default="">
<cfargument name="datasource" type="string" required="no" default="myDSN">
<!--- Define variables --->
<cfset var data="">
<cfset var result=ArrayNew(1)>
<!--- Do search --->
<cfquery name="getPart" datasource="#arguments.datasource#">
SELECT top 20 partnum, partdescription
FROM part
WHERE partnum LIKE '%#trim(arguments.search)#%'
ORDER BY partnum
</cfquery>
<!--- Build result array --->
<cfloop query="getPart">
<cfset returnStruct = StructNew() />
<cfset returnStruct["partnum"] = partnum />
<cfset returnStruct["partdescription"] = partdescription />
<cfset ArrayAppend(result,returnStruct) />
</cfloop>
<!--- And return it --->
<cfreturn serializeJSON(result) />
</cffunction>
</cfcomponent>
、ユーザーが正常にリストからパーツ番号を選択したら、私はに関連する部分の説明をしたいです部品番号の横にある部品説明欄に表示されます。
ありがとうございました。
が提案いただきありがとうございますが、これは一部の記述は、部品番号を選択した後partdescriptionテキストボックスに表示されるようになって実現しませんでした。 – aparker81