使用CFC JSON結果填充輸入字段

我有一個表單設置，我從列表中選擇一個名稱，調用CFC並針對該名稱運行查詢。然後我從該查詢中返回一美元金額。使用CFC JSON結果填充輸入字段

我然後試圖拿出這個美元金額並且改變一個<input>元素的值。

我可以成功運行我的CFC並返回正確的值，但我的JQUERY不會更改我的輸入字段的值。它跳過我的成功：方法和正確的我的錯誤：方法。

這裏是我的表單代碼：

<cfselect class="required" queryPosition="below" query="get_ticket" display="company_name" name="customer_checkout" id="customer_checkout" tabindex="0" onchange="PopulateGrandTotal();" ><option>---Make A Selection---</option></cfselect> 

<div id="grant_totalDIV" > 
     <input type="number" name="grand_total_due" id="grand_total_due"> 
</div>

這裏是我的CFC：

<cffunction name="getTotal" access="remote" returntype="any"> 
<cfargument name="customer_checkout" type="any" required="true"> 

<!--- localize function variables ---> 
<cfset var dataDetail = ""> 

<cfquery name="dataDetail" datasource="#datasource#" > 
select grand_total 
from service_ticket 
where company_name = '#customer_checkout#' 
</cfquery> 


<cfoutput query="dataDetail"> 

    <cfreturn dataDetail.grand_total> 
</cfoutput> 
</cffunction></cfcomponent>

這裏的JQuery：

<script> 
function PopulateGrandTotal(){ 
    // Populate the customer alert DIV based on the customer selection 
    console.log($("#customer_checkout>option:selected").attr("Value")); 

    $.ajax({ 
     url:'cfcs/grand_totalDIV.cfc?method=getTotal&returnformat=json', 
     dataType: 'json', 
     data: { customer_checkout: $("#customer_checkout>option:selected").attr("Value") }, 

     success: function(response) { 
      console.log('Successfully ran JSON, now changing input value'); 
      $("#grand_total_due").val(response); 

      console.log('Input value cahnged'); 

      }, 
     error: function(response){ 

       console.log('Error'); 

       } 
     }); 
} 
</script>

我的JSON響應：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

</head> 
<body> 

</body> 
274.00

任何人都可以幫忙嗎？

來源

2016-02-29 Brian Fleishman

它看起來像你只是簡單地返回文本，所以不要使用dataType: 'json',因爲這不是發送的內容。

您可以直接從阿賈克斯配置

否則刪除選項，您將需要JSON序列化結構和您的成功處理程序中訪問正確的屬性

來源

2016-02-29 16:46:25 charlietfl

好了，我註釋掉的代碼的一部分，現在它運行成功：方法，因爲我可以看到它記錄我在那裏編碼的消息。但它不會改變我的輸入字段的值與響應。我的代碼是否正確？ –

嘗試登錄響應安慰 – charlietfl

更新：我改變了輸入字段的類型從數量到文本，現在它改變了我的價值，這一點： 274.00 –

（太長的評論）

您還應該對齊返回類型，因此雙方都同意返回什麼類型的數據以及以何種格式。如果你喜歡返回純文本，而不是JSON：

設置CFFunction使用適當的返回類型，即returntype="numeric"或returntype="string"
然後告訴CF的格式應該通過提供returnformat參數使用，並使用dataType來告訴jQuery它應該期望收到什麼類型的數據。正如評論中提到的那樣，默認是做一個intelligent guess: (xml, json, script, or html)。但是，提供它並不會傷害任何東西，並且明確指定它有助於避免像最初的json/text問題IMO那樣的無意混淆。
```
$.ajax({ 
    url:'cfcs/grand_totalDIV.cfc?method=getTotal&returnformat=plain', 
    dataType: 'text', 
    ... 
}); 
```

此外，無關你的錯誤，但有幾個技巧：

由於該功能實際上並沒有顯示任何內容，也沒有必要爲<cfoutput query="...">。只需返回單個值：<cfreturn dataDetail.grand_total>
如果函數需要customer_checkout（即字符串，數字等等）的特定類型的值，請在參數簽名中指定它，而不是使用type="any"。
始終使用cfqueryparam以提高性能並防止SQL注入
不要忘記範圍內的所有變量，IE的arguments.customer_checkout代替customer_checkout

來源

2016-02-29 19:41:04 Leigh

FYI'純樸'是不是一個有效的數據類型...「文本」..或「HTML」將是但智能猜測內置將默認爲文本/ HTML無論如何 – charlietfl

@ charlietfl - 哎呀，謝謝。這是一個複製+粘貼錯誤。我會更新它。當然，它可以猜測，但我建議調整類型主要是爲了強調「格式」適合圖片的位置，並且雙方之間存在關係（老實說，它似乎並不完全清楚給提問者）。 – Leigh

使用CFC JSON結果填充輸入字段

回答

相關問題