BIND後調用JS函數？

我正在構建一個類似於發票的ColdFusion 10表單。它包含三列。BIND後調用JS函數？

第一列是用於選擇所有可用產品的子集的篩選器：它包含從產品類別查詢構建的cfselect。

第二列是產品本身：它包含cfselect綁定到包含產品列表的表，僅顯示匹配類別中的產品。

第三列是產品價格：它包含綁定到產品價格的cfdiv，在同一張表中。

我正在尋找一種方法來計算所選項目的總價格（總和）。我特別在尋找附加的「有所改變」的觸發器。

的解決方案，我看到：

一共是另一個BIND，根據每個項目的價格。有點難看，因爲這將在服務器端完成，即使一個簡單的JS可以做到這一點。
在cfselect上使用onChange。在這種情況下，如何確保BIND價格在總額計算之前已經執行？
在cfselect上使用onChange，並使用XMLHttpRequest直接查詢該腳本中的價格（即移除價格列上的BIND）。我寫了一些代碼來做到這一點，它似乎工作，但我仍然需要改變它爲異步請求，並以獨立於瀏覽器的方式解碼返回。這似乎比需要的更復雜。
在cfdiv上使用（不存在的）onChange。這將是最簡單的...但該鉤子不存在。
在第三列中使用cfselect/cfinput而不是cfdiv，並使用css作弊以使其看起來像div。醜陋。
與以前相同，但隱藏，並保持現有的cfdiv可見。現在可能是最好的選擇，但所有查詢都會執行兩次。我確定有更好的方法。
使用計時器。我寧願避免這種情況。

我錯過了什麼？

謝謝。

來源

2013-08-01 jmr

我認爲你應該做的第一件事就是停止使用任何ColdFusion UI嚮導 - 這是ver y執行不力 - 只需使用HTML和JS（JS通過一個流行的庫）。這樣你就不會對抗CF的以UI爲中心的特性的侷限性和過時的質量。只需使用JQuery或其他東西。 –

我不同意。我把它等同於重新發明輪子。 –

第三列（div）究竟是什麼？ –

回答我自己的問題，以防萬一它可以幫助別人。

我有實際做些事情與下載的數據很難找到和這個例子可以說明

粗糙的jQuery相當於簡單CF BIND的$獲得（
例子），而不僅僅是警報（）它

$ .get（）肯定不是推薦的方式來引入jQuery。

這可能會讓「專業人士」驚恐地大喊大叫。它不應該被認爲是複製粘貼代碼，只是提示想辦法做到這一點。

它實際上已從我的工作版本強烈編輯，因此它可能包含虛假的拼寫錯誤。

好吧，足夠的免責聲明。

function dollarize (price) { 
    // unrelated code - just ensure that the price is always displayed with two decimals 
} 

function downloadPrice(url, DOM_Item_ID) { 
    $.get(url, 
      function(data,status){   // keep in mind that this function is called ASYNCHRONOUSLY 
       //alert(data); // typical data received, for a $1 item: <wddxPacket version='1.0'><header/><data><string>1</string></data></wddxPacket> 
       var payload = $(data).find('string').text(); 
       $('##' + DOM_Item_ID).text('$' + dollarize(parseFloat(payload))); <!--- normally a single # - doubled since in a <cfoutput> ---> 
       UpdateTotalPrice(); 
      }, 
      "xml"); 
} 

function UpdateTotalPrice() { 
    var price = 0; 
    for(var e=1;e<=#MAX_NUMBER_ITEM#;e++) 
    { 
     var node = document.getElementById("Item_"+e); 
     var ID = node.selectedIndex; 
     if(ID != 0) { 
      prix += parseFloat(document.getElementById("Price_"+e).childNodes[0].nodeValue.substring(1));  // substring(1): removes the $ added above 
     } 
    } 
    document.getElementById('TotalPrice').childNodes[0].nodeValue = '$' + dollarize(prix); 
} 

function onChangeItem(e) { 
    var ID = document.getElementById("Item_"+e).value; 
    downloadPrice("#application.CFC_PATH#gestion-equipements.cfc?method=trouvePrixStandardEquipement&ID="+ID, 
      "Price_"+e); 
}

第二欄：

<cfloop from="1" to="#MAX_NUMBER_ITEM#" index="e"> 
    ... 
     <cfselect Name="Item_#e#" ID="Item_#e#" bind="........." bindonload="yes" queryPosition="below" onChange="onChangeItem(#e#)"><option value="0">--</cfselect>

在第3列中的每個價格項目：

<cfdiv ID="Price_#e#" align="right">$0.00</cfdiv>  <!--- content of the div (i.e. $0.00) must NOT be empty, otherwise childNodes[0] above will fail --->

總價：

<cfdiv ID="TotalPrice">$0.00</cfdiv>

來源

2013-08-03 02:33:31 jmr

BIND後調用JS函數？

回答

相關問題