Javascript sum grandtotal返回NaN错误

Javascript sum grandtotal returning NaN error

本文关键字：NaN 错误返回 grandtotal sum Javascript 更新时间：2023-09-26

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

但是问题是total，即$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>

可能是什么问题导致这个错误发生?

所有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));
}