Javascript sum grandtotal返回NaN错误

时间:2016-10-15 19:49:57

标签: javascript jquery asp.net

我使用下面的JavaScript代码来获取gridview的总行数和总计

但问题是总计$mult返回NaN

out put i get

Item Name    Unit Price    UOM    Quantity    Total Amount

item1        5.00          pcs      2          10.00

item2        10.00         pcs      3          30.00      

                                               NaN

的JavaScript

<script>
    $(document).ready(function () {
        $(".txtMult input").on('keyup mouseup', multInputs);
        function multInputs() {
            var $mult = 0;
            $("tr.txtMult").each(function () {
                var $UnitPrice = $('.UnitPrice', this).val();
                var $Quantity = $('.Quantity', this).val();
                var $total = (($UnitPrice) * ($Quantity));
                $mult += $total;

            });

            $("tr.txtMult").each(function () {
                var $UnitPrice = $('.UnitPrice', this).val();
                var $Quantity = $('.Quantity', this).val();
                $('.multTotal', this).text(parseFloat($total).toFixed(3));
            });
            $(".lblGrandAmount").text(parseFloat($mult).toFixed(3));
        }
    });
</script>

网格视图

<asp:GridView ID="griditem" OnRowDataBound="griditem_RowDataBound" CssClass="table" GridLines="None" runat="server" ShowFooter="True" AutoGenerateColumns="False">
    <Columns>
        <asp:TemplateField HeaderText="Select">
            <ItemTemplate>
                <asp:CheckBox ID="chkSel" Checked="true" runat="server" />
            </ItemTemplate>
        </asp:TemplateField>

        <asp:BoundField DataField="ItemName" HeaderText="Item Name" SortExpression="Item Name" />
        <asp:TemplateField HeaderText="Unit Price" SortExpression="UnitPrice">
            <ItemTemplate>
                <asp:TextBox ID="txtCalcUnitprice"  TextMode="Number" step="any" Width="120" CssClass="form-control  UnitPrice" runat="server"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="Name" HeaderText="UOM" SortExpression="UOM" />

        <asp:TemplateField HeaderText="Quantity" SortExpression="Quantity">
            <ItemTemplate>
                <asp:TextBox ID="txtCalcQty" Width="120" TextMode="Number" min="0" step="any" CssClass="form-control Quantity" runat="server"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>

        <asp:TemplateField HeaderText="Total Amount">
            <ItemTemplate>
                <asp:Label ID="lbltotalamount" CssClass="multTotal" runat="server"></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblgrandamount" CssClass="lblGrandAmount" runat="server"></asp:Label>
            </FooterTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="ItemID" HeaderText="ItemID" ItemStyle-CssClass="hiddencol" HeaderStyle-CssClass="hiddencol" SortExpression="ItemID" />

    </Columns>
</asp:GridView>

发生此错误的问题是什么?

1 个答案:

答案 0 :(得分:1)

所有tr都有txtMult个班级,因此您需要从计算中排除标题tr和总计tr。您可以使用:gt(0):lt(-1),如下所示。

$(".txtMult input").on('keyup mouseup', multInputs);

function multInputs() {
    var $mult = 0;

    $("tr.txtMult:gt(0):lt(-1)").each(function () {
        var $UnitPrice = $('.UnitPrice', this).val();
        var $Quantity = $('.Quantity', this).val();
        var $total = $UnitPrice * $Quantity;
        $mult += $total;

        $('.multTotal', this).text($total.toFixed(2));
    });

    $(".lblGrandAmount").text($mult.toFixed(2));
}