在同一页面上的多个字段上实现money.js

时间:2013-03-30 17:24:41

标签: php javascript jquery cakephp

我在概念上如何实现这一点(要绑定到哪些事件等)。

我正在使用CakePHP并拥有以下视图:

  • 要展示的一系列产品及相关价格($ products ['Product'] ['price'])
  • 每种产品都有基本货币集($ product ['Currency] ['currency'])
  • 我有money.js,accounting.js和另一个为fx.rates和fx.base设置JSON数据的JS
  • 我知道用户想看的货币,可能与产品基础货币不同(SessionComponent :: read('User.Preferences.Currency')
  • 显示货币短名称(USD)和转换值的div,每个div都带有唯一ID

我的简单测试工作正常 - 使用inline-php我在两个脚本标签之间的页面上放了一些JS。

<script>
var value = accounting.unformat(<? echo $product['Product']['price'] ?>); // clean up number (eg. user input)
var target = "<? echo SessionComponent::read('User.Preference.currency'); ?>"; // or some user input
var convertedValue = fx(value).from("<? echo $product['Currency']['currency']  >").to(target);

accounting.formatMoney(convertedValue, {
    symbol: target,
    format: "%v %s"
}); // eg. "53,180.08 GBP"   

alert(convertedValue);
</script>

精细。效果很好。但我无法解决的是如何在包含N个产品的页面上实现这一点。

我假设我创建了一个JS函数,例如:

fx_convert(divid, price, fromcurrency, tocurrency)

在我的Cake视图中,我使用内联php来回显函数参数。

将jQuery用于此功能的干净方法是什么,并且让价格'divs'调用fx_convert并用转换后的值更新其内容?

或者我的想法完全倒退了吗?非常感谢所有帮助。

1 个答案:

答案 0 :(得分:0)

经过一番体面的睡眠后,想出来了。 :)

使用内联PHP,我通过div属性传递货币到/来自货币并设置统一的类名。 e.g。

<div class="fx" fx-from="<?php echo $product['Currency']['currency']; ?>" fx-to="<?php echo SessionComponent::read('User.Preference.currency') ?>" fx-value="<?php echo $product['Product']['price']; ?>"></div>

然后使用以下jQuery代码片段循环遍历“fx”类的所有元素并执行所需的计算(使用优秀的money.js和accounting.js)

$(document).ready(function() {

$(".fx").each( function( index, element ){

    var value = accounting.unformat($(this).attr("fx-value")); // clean up number (eg. user input)
    var target = $(this).attr("fx-to"); // or some user input
    var convertedValue = fx(value).from($(this).attr("fx-from")).to(target);

    $(this).html(accounting.formatMoney(convertedValue, {
        symbol: target,
        format: "%v %s"
    }));

});

});

仍然需要重构和整理,但解决方案就在那里。