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函数？

回答

相关问题