Question

我正在尝试根据form-field1的输入填充form-field2。这是我的两个表单输入字段。

<input size="50" name="customer_name2" id="customer_name2" tabindex="0" onblur="checkFilled()" type="text" list="customers" />

<cftextarea name="customer_address" cols="50" rows="5" id="customer_address2" tabindex="0" onFocus="populateAddressField()"></cftextarea>

第一个表单字段由以下javascript填充，该部分有效：

<script>  
$(document).ready(function() {  
         $( "##customer_name2" ).autocomplete({
                source: "cfcs/past_customers.cfc?method=lookupCustomers&returnformat=json",
                minLength: 1,
                select: function(event, ui) {
                    $('##customer_name2').val(ui.item.value);
                }
           });
});
</script>

然后我通过AJAX将第一个表单字段的值传递给CFC以运行查询并使用结果填充第二个表单字段。

<script>
function populateAddressField(){                
            $.ajax({
            dataType: 'json',
            data:  {
                        customer_name2: $('##customer_name2').val()
                    },
            url: "cfcs/past_customers.cfc?method=getAddress&returnformat=json",
            beforeSend: function(){
                $('.loader').show();
            },
            complete: function(){
                 $('.loader').hide(3000);
            },
            success: function() {
              $("##customer_address2").val(response);
            }    
        });
}
</script>

这是我的CFC：

<cffunction name="lookupCustomers" access="remote" output="no" hint="I return a list of customers" returnformat="JSON">
<cfargument name="term" required="false" default="" />

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

<!--- Do search --->
<cfquery name="data" datasource="#datasource#">
select distinct company_name
From closed_tickets
where ticket_type = "billable" AND company_name LIKE <cfqueryparam cfsqltype="cf_sql_varchar" value="%#arguments.term#%" />
order by company_name
</cfquery>

<!--- Build result array --->
<cfloop query="data">
<cfset titleStruct = structNew() />
<cfset titleStruct['value'] = company_name/>
<cfset titleStruct['label'] = company_name />

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

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

<cffunction name="getAddress" access="remote" returnType="string">
<cfargument name="customer_name2" type="any" required="true">

<!--- localize function variables --->
<cfset var addressDetail = "">
<cfoutput>
<cfquery name="addressDetail" datasource="#datasource#">
    SELECT company_address
    FROM   closed_tickets
    <!--- adjust cfsqltype if needed --->
    WHERE company_name = <cfqueryparam value="#ARGUMENTS.customer_name2#" cfsqltype="cf_sql_varchar">
</cfquery>
</cfoutput>
<cfreturn addressDetail.company_address>
</cffunction>

<cffunction name="getEmailAddressDetail" access="remote" returnType="string">
<cfargument name="customer_name2" type="any" required="true">

<!--- localize function variables --->
<cfset var dataDetail = "">
<cfoutput>
<cfquery name="emailDetail" datasource="#datasource#">
    SELECT email
    FROM   closed_tickets
    <!--- adjust cfsqltype if needed --->
    WHERE company_name = <cfqueryparam value="#ARGUMENTS.customer_name#" cfsqltype="cf_sql_varchar">
</cfquery>
</cfoutput>
<cfreturn dataDetail.email>
</cffunction>

<cffunction name="getPhoneDetail" access="remote" returnType="string">
<cfargument name="customer_name2" type="any" required="true">

<!--- localize function variables --->
<cfset var dataDetail = "">
<cfoutput>
<cfquery name="dataDetail" datasource="#datasource#">
    SELECT phone
    FROM   closed_tickets
    <!--- adjust cfsqltype if needed --->
    WHERE company_name = <cfqueryparam value="#ARGUMENTS.customer_name#" cfsqltype="cf_sql_varchar">
</cfquery>
</cfoutput>
<cfreturn dataDetail.phone>
</cffunction>

</cfcomponent>

我的第一个表单字段工作正常，我可以在firebug中看到我的AJAX调用响应有数据，但是我解除了控制台错误：

Uncaught ReferenceError: response is not defined

如何使用我的AJAX调用的响应正确设置第二个表单字段的值？感谢。

Answer 1

我自己找到了答案。在定义我的成功函数时，我显然遗漏了（响应）。

我将我的成功功能更改为此功能并且有效：

 success: function(response) {
          $("##customer_address2").val(response);
        }

使用AJAX响应填充表单字段

1 个答案: