0

I'm trying to use sessionStorage to pass information from a merchandise page to shopping cart page, which displays what items were purchased, how many items were purchased, cost of item, cost of subtotal, cost of total before taxes, the tax amount and after taxes. It displays the monetary value of each item, but an undefined output in "Quantity" and a NaN in "Subtotal", before taxes, tax amount and after taxes. Here's a sample of my code:

<script>
var cart7 = 4.95;

function findTotal()
{
    document.getElementById("cart7").value = cart7;
    document.getElementById("product1").value = sessionStorage.get1;
    document.getElementById("price1").value = cart7 * sessionStorage.get1;

    var beforeTax = parseInt(document.getElementById("price1").value) + parseInt(document.getElementById("price2").value) + parseInt(document.getElementById("price3").value) + parseInt(document.getElementById("price4").value) + parseInt(document.getElementById("price5").value) + parseInt(document.getElementById("price6").value);
    document.getElementById("beforeTax").value = beforeTax;

    var taxAmount = parseFloat(beforeTax * 0.074);
    document.getElementById("taxAmount").value = taxAmount.toFixed(2);

    var afterTax = beforeTax + taxAmount;
    document.getElementById("afterTax").value = afterTax;
}
<script>
<body onload="findTotal()">
<table>
                    <tr style = "text-align:center">
                        <td>
                            <h3>Product</h3>      
                        </td>
                        <td>
                            <h3>Quantity</h3>
                        </td>
                        <td>
                            <h3>Price</h3>
                        </td>
                        <td>
                            <h3>Subtotal</h3>
                        </td>

                    </tr>            
                    <tr style = "text-align:center">
                        <td>
                            We Will All Go Together sheet music     
                        </td>
                        <td>
                            &nbsp;&nbsp;<input type="text" value="0" id="product1" size="5" />
                        </td>
                        <td>
                            $<input type="text" value="0" id="cart7" size="5" />
                        </td>
                        <td>
                            $<input type="text" value="0" id="price1" size="5" />
                        </td>

                    </tr>

                    <tr style = "text-align:center"> 
                        <td>
                            Total (before taxes):<br />
                        </td>
                            <td>
                                <p><input type="text" value="0" id="beforeTax" size="5" /></p>
                            </td>
                        <tr style = "text-align:center">
                            <td>
                                Tax:<br />
                            </td>
                            <td>
                                <p><input type="text" value="0" id="taxAmount" size="5" /></p>
                            </td>
                        </tr>
                        <tr style = "text-align:center">
                            <td>
                                Total (after taxes):<br />
                            </td>
                        <td>
                            <p><input type="text" value="0" id="afterTax" size="5" /></p>
                        </td>

                    </tr>
</body>
2
Contributors
1
Reply
13
Views
3 Years
Discussion Span
Last Post by ryantroop
0

parseInt and parseFloat does not guarantee a number. If either of those return undefined and you do any arithmetic on it, you will get NaN.

You have here a product of bad code design.

declare your variables. check them for values after assigning them. Then do math.

ex:

var fVal;
var fPrice1, fPrice2, fPriceTotal;

fVal = document.getElementById("price1").value;
fPrice1 = fVal ? fVal : 0.00;
fVal = document.getElementById("price2");
fPrice2 = fVal ? fVal : 0.00;

//the math...

fPrice3 = fPrice1 + fPrice2; //intrinsic type check based on math operator.

If that is not your problem, I don't see anything else wrong and will have to reread it.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.