I have a specific problem with JavaScript. When I print the value to console it shows everything ok. But in html it shows old value up until I choose another item than it refreshes the first item. Following is the js and html code:
HTML
onmouseover="OrderItem.setTotalPrice(event,this,'{{ menu_item.id }}')"
JS
setTotalPrice:function(event,a_htmlCaller, a_iMenuItemID){
item_total = OrderItem.Topping._order_toppings.find(function(a_oOTopp){
return parseInt(a_oOTopp.iid) == parseInt(a_iMenuItemID);}.bind(this));
var total_price = 0.00;
var base_price = parseFloat($('pz-mitem-p-'+a_iMenuItemID).value);
var _html = '<div class="tot-price-item"><b>Item Price</b>: ';
if(item_total){
// go into item details but with no changes
if(item_total.toppings.tot_price.length == 1 && item_total.toppings.tot_price[0].length == 0){
total_price += base_price;
_html += '' + total_price;
}else{
for(var i=0; i < item_total.toppings.tot_price.length; i++){
// total_price += parseFloat(item_total.toppings.tot_price[i][0]);
_html += '<div>' + (parseFloat(item_total.toppings.tot_price[i][0]).toFixed(2)).toString() + '</div>';
}
}
}else{
total_price += base_price;
_html += '' + total_price;
}
_html += '</div>';
Tips.add(
a_htmlCaller,
event,
_html,
{
className:'rounded',
stem: true,
tipJoint: [ 'left', 'middle' ],
target:a_htmlCaller,
targetJoint: null//[ 'right', 'right' ]
}
);
},
EDIT: Added code given by Asker in comment. Added formatting.
TIP: Instead of posting code in comments, post it as an edit in your original question, as it makes it much easier to read rather than a huge mess in a comment with absolutely no formatting.
for(var i=0; i < item_total.toppings.tot_price.length; i++) {
//total_price += parseFloat(item_total.toppings.tot_price[i][0]);
_html += '<div>' + (parseFloat(item_total.toppings.tot_price[i][0]).toFixed(2)).toString() + '</div>';
test = parseFloat(item_total.toppings.tot_price[i][0]).toFixed(2);
console.log(test);
}