I am currently converting my friends website, as it's not "mobile friendly" by changing his current frontend into a bootstrap front end.
I've been working on a test site which is just a sub-domain on the same server.
This is the old website: http://bit.ly/1hurTNB
This is the new website: http://bit.ly/1hus0IV
But I've encountered a problem with the shopping cart page.
The shopping cart no longer recalculates its total when I press the recalculate button. It works fine on the old website. I dont know what I've changed to break it?
I've debugged the JavaScript using Chrome Dev Tools (F12) and line no 150 of order.php has this error:
Uncaught TypeError: Cannot read property 'value' of undefined
And this is the line of offending code:
if (document.forms[1].elements["qty" + count].value == "" ||
document.forms[1].elements["qty" + count].value == 0) {
document.forms[1].elements["qty" + count].value = 0;
showInCart = false;
}
I don't understand why I am getting this error? Googling around gives vague answers. Which is why I am here on StackOverflow.
BTW if you want to recreate my problem you'll need to:
go to the homepage
choose a product category from the grid of pictures e.g. "get costume ideas..."
add an item to the basket.
once the page posts to Order.php Change its Quantity.
click the recalculate button.
Why is the Javascript no longer picking up the values from the quantity fields???
Any help is greatly appreciated.
Here is the function in its entirety:
<script type="text/javascript">
function recalculateTotal(){
var lineTotal = 0;
var subTotal = 0;
var total = 0;
var hiddenStuff = "";
var count;
var i;
var orderURL="register.php?orderDetails=";
items = new Array(<?=$itemList?>);
for (i in items){
var cNum = 0;
var pNum = 0;
var qNum = 0;
count = items[i];
cNum = (count * 4) + 1;
var showInCart = true;
// the next line is broken!
if (document.forms[1].elements["qty" + count].value == "" || document.forms[1].elements["qty" + count].value == 0){
document.forms[1].elements["qty" + count].value = 0;
showInCart = false;
}
lineTotal = document.forms[1].elements["qty" + count].value * document.forms[1].elements["price" + count].value;
document.getElementById("lTotal" + count).innerHTML = formatCurrency(lineTotal);
subTotal += lineTotal;
if (hiddenStuff == ""){
hiddenStuff = hiddenStuff + showInCart + ":" + document.forms[1].elements["productId" + count].value + ':' + document.forms[1].elements["qty" + count].value;
}else{
hiddenStuff = hiddenStuff + ":" + showInCart + ":" + document.forms[1].elements["productId" + count].value + ':' + document.forms[1].elements["qty" + count].value;
}
}
document.getElementById("subTotal").innerHTML = formatCurrency(subTotal);
for (var j in delivery_prices){
if (subTotal >= delivery_prices[j].total_amount_start && subTotal <= delivery_prices[j].total_amount_end){
document.getElementById('delivery').innerHTML = delivery_prices[j].delivery_price;
total = subTotal + delivery_prices[j].delivery_price;
}
}
document.getElementById("total").innerHTML = formatCurrency(total);
document.forms[1].elements["orderDetails"].value = hiddenStuff;
orderURL = orderURL + hiddenStuff;
var myrequest = $.ajax({
url: orderURL,
type: "get",
});
myrequest.done(function (response){
updateBasket();
});
}
</script>
Thanks very much.