Question

I have this javascript, jquery function, (below)

1. It gets the text inside each table cell (of class=”total_item_price”) of a table.
2. It puts it into an array (prices_array)
3. Adds up prices_array and formats them to 2 Decimal Places.
4. Then outputs it into the total_order_price, or returns it if do_request isset.

Problem: I have a function that deletes a item from the basket, then calls this function (getTotalPrice) to update the prices field. This part does not work correctly, and is not producing the correct price.

Basically, I need this function, to:

• Get the price(s) of (.total_item_price) which is inside a cell.
• Get the shipping price (.shipping_price) + Add them all up
• Display it inside cell (.total_order_price)

Then When I call my delete function, I can call ^this^ function to hopefully update the price correctly.
I also call this getTotalPrice function on DOM Ready to update the prices, so its important it works correctly, It also has to work when I call my delete function (below).

I have a jsfiddle but it doesn’t work, but this code does work on my localhost. I had to compact it for jsfiddle, and its broken somewhere. Feel free to edit how you want.

---

Here Is the Code(!):
This function gets the total price and displays it.

function getTotalPrice(do_request)
{
var prices_array = new Array(); // Where our prices are held 

// For each .total_item_price - a <td> within my table.
$(".total_item_price").each(function(e){
    var text = $(this).text();                   // Get the value
    var prices = text.substring(1, text.length); // Format it into a string
    prices_array.push(prices);                   // Push it onto our array
});

var result = eval(0);
//  Add up our array
for(i = 0; i < prices_array.length; i++)
{
    temp = eval(prices_array[i]);
    result += temp;
}
// Round up our result to 2 Decimal Places
result = Math.round(result*100)/100;
// Output/Return our result
if (do_request == null)
{
    // We want to add our shipping Price and Display the total
    // Get the Shipping Price
    var shipping_price = $(".shipping_price").html();
    shipping_price = shipping_price.substring(1, shipping_price.length);

    // Add em
    result += eval(shipping_price);

    // Round our result to 2 decimal places
    var result=Math.round(result*100)/100;

    // Update & Display the Result
    $('.total_order_price').html("<b>£" + result + "</b>");        
}
else 
{
    // Otherwise we just want the total price and return it.
    return result;
}
}

This is the function I made to delete a row from the table and update the prices.

// Delete Item from Basket, Run on click of delete button
function delete_item(e)
{
doIt = confirm('Delete Item from Basket?\r\n You can not undo this action.');
if(doIt)
{
  // Get our basket
  var basket_md5 = $(e).parent().find("input[name='basket_md5']").val();
  var url = "<?php echo SERVER_URL."shop/basket"; ?>";
  // Post to basket
  $.post(url, { "do": "delete_item","basket_md5": basket_md5});

  // Delete Row from Table
  // Row Scope
  var row = $(e).parent().parent();

  // Effect & Remove from DOM
  $(row).fadeOut(1000, function(){ 
      $(this).remove();

  });

  // Update the Prices (again)
  //tprice = getTotalPrice("return");
  //$('.total_order_price').html("<b>£" + tprice + "</b>"); 
  getTotalPrice();
 }
} 

Answer 1

In function delete_item(e) move ‘getTotalPrice(); here:

$(row).fadeOut(1000, function(){ 
      $(this).remove();
      // Update the Prices (again)
      //tprice = getTotalPrice("return");
     //$('.total_order_price').html("<b>£" + tprice + "</b>"); 
     getTotalPrice();
  });