Блог

Я использую приведенный ниже код JavaScript для получения итогов строк и общего итога gridview

но проблема в общем итоге, который $mult возвращает NaN

в результате я получаю

 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 s имеют класс 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));
}