jQueryUI 自动完成 - 无法显示返回的选择 (Coldfusion)答案

【问题标题】：jQueryUI autocomplete - unable to display returned selection (Coldfusion)jQueryUI 自动完成 - 无法显示返回的选择 (Coldfusion)
【发布时间】：2019-10-10 13:39:25
【问题描述】：

这快把我逼疯了。我正在使用 jQueryUI 自动完成功能来拉回客户名称和客户 ID 对。用户应该能够开始输入客户名称并获得建议列表，从列表中进行选择，并在选择后将客户 ID 分配给隐藏字段。在分配所选值之前，自动完成工作正常。用户可以开始输入并获得建议列表并选择一个。此时文本字段中的值将变为客户id而不是客户名称，这就是问题所在。

jQuery 代码：

$( "#enaCustomer" ).autocomplete({
    source: "customerLookup.cfc?method=lookupCustomer&returnformat=json",
    minLength: 2,
    select: function(event, ui) {
        console.log(ui);
        console.log(ui.item.label);
        $('#enaCustomer').val(ui.item.label);
        $('#enaCusID').val(ui.item.value);
    }
});

氟氯化碳：

<cffunction name="lookupCustomer" access="remote" output="no" returnformat="JSON">

    <cfargument name="term" required="true" default="" />

    <!--- Define variables --->
    <cfset var returnArray = ArrayNew(1)>

    <!--- Do search --->
    <cfquery name="rsCustomers" datasource="myDB">
        SELECT      cusID, cusCustomer
        FROM        tblCustomers
        WHERE       cusCustomer LIKE <cfqueryparam cfsqltype="cf_sql_varchar" value="%#term#%" />
        ORDER BY    cusCustomer
    </cfquery>

    <!--- Build result array --->
    <cfloop query="rsCustomers">
        <cfset customerStruct = structNew() />
        <cfset customerStruct['value'] = cusID />
        <cfset customerStruct['label'] = cusCustomer />

        <cfset arrayAppend(returnArray, customerStruct) />    
    </cfloop>

    <!--- And return it --->
    <cfreturn returnArray />

</cffunction>

console.log(ui) 显示此示例客户：

item: Object { label: "Customer 4", value: 4 }

console.log(ui.item.label):

"Customer 4"

但这似乎不起作用：

$('#enaCustomer').val(ui.item.label);

这里一定有一些简单的东西我错过了，但我不知道它是什么。有什么想法吗？

【问题讨论】：

我看到的第一个问题是在函数定义和 ajax 调用中都有returnformat=json。您应该只拥有其中一个。
你说console.log 显示label: "Customer 4" 。关键字item从哪里来，你以后用ui.item.label？
@user12031119 - 从 ajax 调用中删除了 returnformat=json 但对问题没有影响。
@Bernhard - 我想我把事情搞混了。它应该看起来像这样 - item: Object { label: "Customer 3", value: 3 }。让我编辑一下。
QQ;哪个版本的 ColdFusion？

标签： jquery-ui coldfusion

【解决方案1】：

查看演示：jQuery UI | AutoComplete | Custom Data

建议如下：

$("#enaCustomer").autocomplete({
  source: "customerLookup.cfc?method=lookupCustomer&returnformat=json",
  minLength: 2,
  select: function(event, ui) {
    $('#enaCustomer').val(ui.item.label);
    $('#enaCusID').val(ui.item.value);
    return false;
  }
});

这会导致函数结束而不执行任何进一步的操作。

【讨论】：