row total

by Oliver Kelso

HTML

<form name="panierform" id="panierform" method="post" action="">
    <table width="80%" border="2" id="myTable">
        <tr>
            <th scope="col">Product</th>
            <th scope="col">Price</th>
            <th scope="col">Qty</th>
            <th scope="col">Product Total</th>
        </tr>
        <tr>
            <td>
                <label for="article"></label>
                <input type="text" name="article" id="article" class="article" value="1" />
            </td>
            <td>
                <label for="prix"></label>
                <input name="prix" type="text" id="prix" class="prix" value="10" />
            </td>
            <td>
                <label for="quantity"></label>
                <input name="quantity" type="number" id="quantity" class="quantity" value="1" />
            </td>
            <td>
                <label for="ptotal"></label>
                <input type="text" name="ptotal" id="ptotal" class="ptotal" value="" />
            </td>
        </tr>
        <tr>
            <td>
                <label for="article"></label>
                <input type="text" name="article" id="article" class="article" value="2" />
            </td>
            <td>
                <label for="prix"></label>
                <input name="prix" type="text" id="prix" class="prix" value="40" />
            </td>
            <td>
                <label for="quantity"></label>
                <input name="quantity" type="number" id="quantity" class="quantity" value="1" />
            </td>
            <td>
                <label for="ptotal"></label>
                <input type="text" name="ptotal" id="ptotal" class="ptotal" value="" />
            </td>
        </tr>
    </table>
</form>

JavaScript

function calculatePtotal() {
    $("tr", "#myTable").each(function (i, row) {
        $row = $(row);
        var value = parseFloat($('.prix', $row).val());
        var quantity = parseFloat($(".quantity", $row).val());
        var shipping = parseFloat($(".shipping", $row).val());
        var ptotal = (value * quantity);
        $(".ptotal", $row).val(parseFloat(ptotal).toFixed(2));
    });
}

calculatePtotal();

$(".quantity, .shipping").change(function () {
    calculatePtotal();
});