locked
How I Sum column values using Jquery (aspx) RRS feed

  • Question

  • User-582711651 posted

    Hi Friends, 

    I tried, but I can't get column sum values, and the individual column values show in grid fooder, and overall grant total values show label lbl_grtot, pls help me. 

    This is my grid-view 

    <asp:GridView ID="Grv_ProjectBooking" runat="server" AutoGenerateColumns="False" CellPadding="4" CssClass="smalltext2" ForeColor="#333333" GridLines="Vertical" OnRowDeleting="Grv_Project_RowDeleting" Width="647px" ShowFooter="True">
    <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    <Columns>
    <asp:BoundField DataField="RowNumber" HeaderText="SNo" />
    <asp:TemplateField HeaderText="Pillar">
    <ItemTemplate>
    <asp:DropDownList ID="Drd_Pillar" runat="server" AutoPostBack="true" CssClass="normalText2" onselectedindexchanged="GetProject_Names">
    <asp:ListItem Value="0">Select</asp:ListItem>
    <asp:ListItem Value="1">CLEP</asp:ListItem>
    <asp:ListItem Value="2">SHG</asp:ListItem>
    <asp:ListItem Value="3">SDTC</asp:ListItem>
    </asp:DropDownList>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Project Booking">
    <FooterTemplate>
    <asp:Label ID="Label150" runat="server" CssClass="tablehead2" ForeColor="White" Text="Total :"></asp:Label>
    </FooterTemplate>
    <ItemTemplate>
    <asp:DropDownList ID="Drd_ProjectCostCtr" runat="server" AutoPostBack="true" CssClass="normalText2" Width="180px">
    <asp:ListItem Value="0">Select One</asp:ListItem>
    </asp:DropDownList>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Gr.Sal">
    <FooterTemplate>
    <asp:Label ID="lbl_tot_grsal" runat="server"  CssClass="tablehead2" ForeColor="White"></asp:Label>
    </FooterTemplate>
    <ItemTemplate>
    <asp:TextBox ID="Txt_GrSalary" runat="server" CssClass="normalText2" onblur="GetTotal(this)" autocomplete="off"  MaxLength="7" onkeypress="return isNumberKey(event)" Width="50px"></asp:TextBox>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="MobPh">
    <FooterTemplate>
    <asp:Label ID="lbl_tot_moballow" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    </FooterTemplate>
    <ItemTemplate>
    <asp:TextBox ID="Txt_MobAllow" runat="server" CssClass="normalText2"  onblur="GetTotal(this)" MaxLength="7" onkeypress="return isNumberKey(event)" Width="50px"></asp:TextBox>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Loc.TA">
    <FooterTemplate>
    <asp:Label ID="lbl_tot_ta" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    </FooterTemplate>
    <ItemTemplate>
    <asp:TextBox ID="Txt_LocTA" runat="server" CssClass="normalText2" MaxLength="7" onblur="GetTotal(this)" onkeypress="return isNumberKey(event)" Width="50px"></asp:TextBox>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Hardship">
    <FooterTemplate>
    <asp:Label ID="lbl_tot_hsip" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    </FooterTemplate>
    <ItemTemplate>
    <asp:TextBox ID="Txt_HardShip" runat="server" CssClass="normalText2" MaxLength="7" onblur="GetTotal(this)" onkeypress="return isNumberKey(event)" Width="50px"></asp:TextBox>
    </ItemTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="+">
    <ItemTemplate>
    <asp:ImageButton ID="ImgBtn_Prj_Yes" runat="server" CausesValidation="false" Height="21px" ImageUrl="~/Images/smallsuccess.gif" onclick="Project_Grid_AddtlRow" Width="21px" />
    </ItemTemplate>
    </asp:TemplateField>
    <asp:CommandField ButtonType="Image" DeleteImageUrl="~/Images/Med_smallfail.gif" HeaderText="-" ItemStyle-CssClass="smalltext" ShowDeleteButton="True">
    <ItemStyle CssClass="smalltext" />
    </asp:CommandField>
    </Columns>
    <EditRowStyle BackColor="#999999" />
    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
    <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
    <SortedAscendingCellStyle BackColor="#E9E7E2" />
    <SortedAscendingHeaderStyle BackColor="#506C8C" />
    <SortedDescendingCellStyle BackColor="#FFFDF8" />
    <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
    </asp:GridView>
    
    This is my Jquery, here am getting result zero, and loop is not ending 

    <script src="JScript/jquery-1.5.2.js" type="text/javascript"></script>
    <script type="text/javascript">

    function GetTotal() { var gr_tot = 0; var t_grsal = 0; var t_mobph = 0; var t_locta = 0; var t_hrshp = 0; var grid = document.getElementById("Grv_ProjectBooking"); if (grid.rows.length > 0) { var inputs = grid.getElementsByTagName("input"); var i = 0; var rx = 2; i = (rx + i); var grl = (grid.rows.length - 1); for (var r = 1; r < grl; r++) { if (inputs[i].name.indexOf("Txt_GrSalary") > 0) { if (inputs[i].value != "") { gr_tot = gr_tot + parseInt(inputs[i].value); t_grsal = parseInt(inputs[i].value); } } rx = (rx + 1); i = (rx); if (inputs[i].name.indexOf("Txt_MobAllow") > 1) { if (inputs[i].value != "") { t_mobph = parseInt(inputs[i].value); } } rx = (rx + 1); i = (rx); if (inputs[i].name.indexOf("Txt_LocTA") > 1) { if (inputs[i].value != "") { t_locta = parseInt(inputs[i].value); } } rx = (rx + 1); i = (rx); if (inputs[i].name.indexOf("Txt_HardShip") > 1) { if (inputs[i].value != "") { t_hrshp = parseInt(inputs[i].value); } } rx = (rx + 1); i = (rx); $("[id*=lbl_tot_grsal]").html(t_grsal.toString()); $("[id*=lbl_tot_ta]").html(t_mobph.toString()); $("[id*=lbl_tot_moballow]").html(t_locta.toString()); $("[id*=lbl_tot_hsip]").html(t_hrshp.toString()); gr_tot = (t_grsal + t_mobph + t_locta + t_hrshp); $("[id*=lbl_grtot]").html(gr_tot.toString()); gr_tot = 0; rx = (rx + 2); i = 0; i = (rx); } } }
    </script>

    Thanks in advance

    Monday, December 16, 2019 5:40 AM

Answers

  • User1535942433 posted

    Hi ayyappan.CNN,

    Accroding to your codes,I found that when rx=2,it couldn't intercept the name of the textbox.So the foot label's value is null.
    Besides,you should superimpose the values of each row in your js codes.

    More details ,you could refer to below codes:

    <script src="Scripts/jquery-1.10.2.js"></script>
    
        <script type="text/javascript">
    
            function GetTotal() {
    
                var gr_tot = 0;
    
                var total_tot = 0;
    
     
    
                var c_grsal = 0;
    
                var c_mobph = 0;
    
                var c_locta = 0;
    
                var c_hrshp = 0;
    
     
    
                var t_grsal = 0;
    
                var t_mobph = 0;
    
                var t_locta = 0;
    
                var t_hrshp = 0;
    
     
    
     
    
                var grid = document.getElementById("Grv_ProjectBooking");
    
                if (grid.rows.length > 0) {
    
                    var inputs = grid.getElementsByTagName("input");
    
                    var i = 0;
    
                    var rx = 0;
    
     
    
                    i = (rx + i);
    
     
    
                    var grl = (grid.rows.length - 1);
    
                    for (var r = 1; r < grl; r++) {
    
     
    
                        if (inputs[i].name.indexOf('Txt_GrSalary') > 0) {
    
     
    
                            if (inputs[i].value != "") {
    
     
    
                                gr_tot = gr_tot + parseInt(inputs[i].value);
    
                                t_grsal = parseInt(inputs[i].value);
    
                            }
    
                        }
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
     
    
                        if (inputs[i].name.indexOf("Txt_MobAllow") > 1) {
    
                            if (inputs[i].value != "") {
    
                                t_mobph = parseInt(inputs[i].value);
    
                            }
    
                        }
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
     
    
                        if (inputs[i].name.indexOf("Txt_LocTA") > 1) {
    
                            if (inputs[i].value != "") {
    
                                t_locta = parseInt(inputs[i].value);
    
                            }
    
                        }
    
     
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
                        if (inputs[i].name.indexOf("Txt_HardShip") > 1) {
    
                            if (inputs[i].value != "") {
    
                                t_hrshp = parseInt(inputs[i].value);
    
                            }
    
                        }
    
     
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
                        c_grsal += t_grsal;
    
                        c_mobph += t_mobph;
    
                        c_locta += t_locta;
    
                        c_hrshp += t_hrshp;
    
                        $("[id*=lbl_tot_grsal]").html(c_grsal.toString());
    
                        $("[id*=lbl_tot_moballow]").html(c_mobph.toString());
    
                        $("[id*=lbl_tot_ta]").html(c_locta.toString());
    
                        $("[id*=lbl_tot_hsip]").html(c_hrshp.toString());
    
     
    
                        
    
                        rx = (rx + 2);
    
     
    
                        i = 0;
    
                        i = (rx);
    
                       
    
                    } 
    
                        gr_tot = (c_grsal + c_mobph + c_locta + c_hrshp);
    
                        $("[id*=Label150]").html("Total:" + gr_tot.toString());
    
     
    
                }
    
                 
    
            }
    
        </script>
    
    
    <asp:GridView ID="Grv_ProjectBooking" runat="server" AutoGenerateColumns="False" CellPadding="4" CssClass="smalltext2" ForeColor="#333333" GridLines="Vertical" OnRowDeleting="Grv_Project_RowDeleting" Width="647px" ShowFooter="True" OnSelectedIndexChanged="Grv_ProjectBooking_SelectedIndexChanged">
    
                    <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    
                    <Columns>
    
                        <asp:BoundField DataField="RowNumber" HeaderText="SNo" SortExpression="RowNumber" ReadOnly="true" />
    
                        <asp:TemplateField HeaderText="Pillar">
    
                            <ItemTemplate>
    
                                <asp:DropDownList ID="Drd_Pillar" runat="server" AutoPostBack="true" CssClass="normalText2" OnSelectedIndexChanged="GetProject_Names">
    
                                    <asp:ListItem Value="0">Select</asp:ListItem>
    
                                    <asp:ListItem Value="1">CLEP</asp:ListItem>
    
                                    <asp:ListItem Value="2">SHG</asp:ListItem>
    
                                    <asp:ListItem Value="3">SDTC</asp:ListItem>
    
                                </asp:DropDownList>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Project Booking">
    
                            <FooterTemplate>
    
                                <asp:Label ID="Label150" runat="server" CssClass="tablehead2" ForeColor="White" Text="Total :" onblur="GetTotal(this)"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:DropDownList ID="Drd_ProjectCostCtr" runat="server" AutoPostBack="true" CssClass="normalText2" Width="180px">
    
                                    <asp:ListItem Value="0">Select One</asp:ListItem>
    
                                </asp:DropDownList>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Gr.Sal">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_grsal" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_GrSalary" runat="server" CssClass="normalText2" onblur="GetTotal(this)" autocomplete="off" MaxLength="7" Width="50px" Text='<%# Bind("Sal") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="MobPh">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_moballow" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_MobAllow" runat="server" CssClass="normalText2" onblur="GetTotal(this)" MaxLength="7" Width="50px" Text='<%# Bind("MobPh") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Loc.TA">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_ta" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_LocTA" runat="server" CssClass="normalText2" MaxLength="7" onblur="GetTotal(this)" Width="50px" Text='<%# Bind("TA") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Hardship">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_hsip" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_HardShip" runat="server" CssClass="normalText2" MaxLength="7" onblur="GetTotal(this)" Width="50px" Text='<%# Bind("Hardship") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="+">
    
                            <ItemTemplate>
    
                                <asp:ImageButton ID="ImgBtn_Prj_Yes" runat="server" CausesValidation="false" Height="21px" ImageUrl="image/add.jfif" OnClick="Project_Grid_AddtlRow" Width="21px" />
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:CommandField ButtonType="Image" DeleteImageUrl="image/small.jfif" HeaderText="-" ItemStyle-CssClass="smalltext" ShowDeleteButton="True">
    
                            <ItemStyle CssClass="smalltext" />
    
                        </asp:CommandField>
    
                    </Columns>
    
                    <EditRowStyle BackColor="#999999" />
    
                    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    
                    <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    
                    <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
    
                    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
    
                    <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
    
                    <SortedAscendingCellStyle BackColor="#E9E7E2" />
    
                    <SortedAscendingHeaderStyle BackColor="#506C8C" />
    
                    <SortedDescendingCellStyle BackColor="#FFFDF8" />
    
                    <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
    
                </asp:GridView>

    Result:

    Best regards,

    Yijing Sun

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, December 17, 2019 9:31 AM
  • User-582711651 posted

    Hi Yij Sun, 

    Excellent, I have added a few things;

    pls ref.

    unction GetTotal() {
    
                var gr_tot = 0;
                var total_tot = 0;
                var c_grsal = 0;
                var c_mobph = 0;
                var c_locta = 0;
                var c_hrshp = 0;
    
                var t_grsal = 0;
                var t_mobph = 0;
                var t_locta = 0;
                var t_hrshp = 0;
    
                var grid = document.getElementById("Grv_ProjectBooking");
    
                if (grid.rows.length > 0) {
                    var inputs = grid.getElementsByTagName("input");
                    var i = 0;
                    var rx = 0;
                    i = (rx + i);
                    var grl = (grid.rows.length - 1);
                    for (var r = 1; r < grl; r++) {
                        if (inputs[i].name.indexOf('Txt_GrSalary') > 0) {
                            if (inputs[i].value != "") {
                                gr_tot = gr_tot + parseInt(inputs[i].value);
                                t_grsal = parseInt(inputs[i].value);
                            }  else {
                                   t_grsal = 0
                               }
                        }
                        rx = (rx + 1);
                        i = (rx);
                        if (inputs[i].name.indexOf("Txt_MobAllow") > 0) {
                            if (inputs[i].value != "") {
                                t_mobph = parseInt(inputs[i].value);
                           } else {
                                   t_mobph = 0
                               }
    
                        }
                        rx = (rx + 1);
                        i = (rx);
     
                        if (inputs[i].name.indexOf("Txt_LocTA") > 0) {
                            if (inputs[i].value != "") {
                                t_locta = parseInt(inputs[i].value);
                            } else {
                                   t_locta = 0
                               }
                        }
    
                        rx = (rx + 1);
                        i = (rx);
    
                        if (inputs[i].name.indexOf("Txt_HardShip") > 0) {
                            if (inputs[i].value != "") {
                                t_hrshp = parseInt(inputs[i].value);
                            } else {
                                   t_hrshp = 0
                               }
                        }
    
                       rx = (rx + 1);
                        i = (rx);
    
    
                        c_grsal += t_grsal;
                        c_mobph += t_mobph;
                        c_locta += t_locta;
                        c_hrshp += t_hrshp;
    
                        $("[id*=lbl_tot_grsal]").html(c_grsal.toString());
                        $("[id*=lbl_tot_moballow]").html(c_mobph.toString());
                        $("[id*=lbl_tot_ta]").html(c_locta.toString());
                        $("[id*=lbl_tot_hsip]").html(c_hrshp.toString());
    
                        rx = (rx + 2);
                        i = 0;
                        i = (rx);
                    } 
    
                        gr_tot = (c_grsal + c_mobph + c_locta + c_hrshp);
    
                        $("[id*=lbl_grtot]").html("Total:" + gr_tot.toString());
                }
                        }

    Thanks a lot.

    :)

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, December 17, 2019 11:50 AM

All replies

  • User1535942433 posted

    Hi ayyappan.CNN,

    Accroding to your codes,I found that when rx=2,it couldn't intercept the name of the textbox.So the foot label's value is null.
    Besides,you should superimpose the values of each row in your js codes.

    More details ,you could refer to below codes:

    <script src="Scripts/jquery-1.10.2.js"></script>
    
        <script type="text/javascript">
    
            function GetTotal() {
    
                var gr_tot = 0;
    
                var total_tot = 0;
    
     
    
                var c_grsal = 0;
    
                var c_mobph = 0;
    
                var c_locta = 0;
    
                var c_hrshp = 0;
    
     
    
                var t_grsal = 0;
    
                var t_mobph = 0;
    
                var t_locta = 0;
    
                var t_hrshp = 0;
    
     
    
     
    
                var grid = document.getElementById("Grv_ProjectBooking");
    
                if (grid.rows.length > 0) {
    
                    var inputs = grid.getElementsByTagName("input");
    
                    var i = 0;
    
                    var rx = 0;
    
     
    
                    i = (rx + i);
    
     
    
                    var grl = (grid.rows.length - 1);
    
                    for (var r = 1; r < grl; r++) {
    
     
    
                        if (inputs[i].name.indexOf('Txt_GrSalary') > 0) {
    
     
    
                            if (inputs[i].value != "") {
    
     
    
                                gr_tot = gr_tot + parseInt(inputs[i].value);
    
                                t_grsal = parseInt(inputs[i].value);
    
                            }
    
                        }
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
     
    
                        if (inputs[i].name.indexOf("Txt_MobAllow") > 1) {
    
                            if (inputs[i].value != "") {
    
                                t_mobph = parseInt(inputs[i].value);
    
                            }
    
                        }
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
     
    
                        if (inputs[i].name.indexOf("Txt_LocTA") > 1) {
    
                            if (inputs[i].value != "") {
    
                                t_locta = parseInt(inputs[i].value);
    
                            }
    
                        }
    
     
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
                        if (inputs[i].name.indexOf("Txt_HardShip") > 1) {
    
                            if (inputs[i].value != "") {
    
                                t_hrshp = parseInt(inputs[i].value);
    
                            }
    
                        }
    
     
    
                        rx = (rx + 1);
    
                        i = (rx);
    
     
    
                        c_grsal += t_grsal;
    
                        c_mobph += t_mobph;
    
                        c_locta += t_locta;
    
                        c_hrshp += t_hrshp;
    
                        $("[id*=lbl_tot_grsal]").html(c_grsal.toString());
    
                        $("[id*=lbl_tot_moballow]").html(c_mobph.toString());
    
                        $("[id*=lbl_tot_ta]").html(c_locta.toString());
    
                        $("[id*=lbl_tot_hsip]").html(c_hrshp.toString());
    
     
    
                        
    
                        rx = (rx + 2);
    
     
    
                        i = 0;
    
                        i = (rx);
    
                       
    
                    } 
    
                        gr_tot = (c_grsal + c_mobph + c_locta + c_hrshp);
    
                        $("[id*=Label150]").html("Total:" + gr_tot.toString());
    
     
    
                }
    
                 
    
            }
    
        </script>
    
    
    <asp:GridView ID="Grv_ProjectBooking" runat="server" AutoGenerateColumns="False" CellPadding="4" CssClass="smalltext2" ForeColor="#333333" GridLines="Vertical" OnRowDeleting="Grv_Project_RowDeleting" Width="647px" ShowFooter="True" OnSelectedIndexChanged="Grv_ProjectBooking_SelectedIndexChanged">
    
                    <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
    
                    <Columns>
    
                        <asp:BoundField DataField="RowNumber" HeaderText="SNo" SortExpression="RowNumber" ReadOnly="true" />
    
                        <asp:TemplateField HeaderText="Pillar">
    
                            <ItemTemplate>
    
                                <asp:DropDownList ID="Drd_Pillar" runat="server" AutoPostBack="true" CssClass="normalText2" OnSelectedIndexChanged="GetProject_Names">
    
                                    <asp:ListItem Value="0">Select</asp:ListItem>
    
                                    <asp:ListItem Value="1">CLEP</asp:ListItem>
    
                                    <asp:ListItem Value="2">SHG</asp:ListItem>
    
                                    <asp:ListItem Value="3">SDTC</asp:ListItem>
    
                                </asp:DropDownList>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Project Booking">
    
                            <FooterTemplate>
    
                                <asp:Label ID="Label150" runat="server" CssClass="tablehead2" ForeColor="White" Text="Total :" onblur="GetTotal(this)"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:DropDownList ID="Drd_ProjectCostCtr" runat="server" AutoPostBack="true" CssClass="normalText2" Width="180px">
    
                                    <asp:ListItem Value="0">Select One</asp:ListItem>
    
                                </asp:DropDownList>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Gr.Sal">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_grsal" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_GrSalary" runat="server" CssClass="normalText2" onblur="GetTotal(this)" autocomplete="off" MaxLength="7" Width="50px" Text='<%# Bind("Sal") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="MobPh">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_moballow" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_MobAllow" runat="server" CssClass="normalText2" onblur="GetTotal(this)" MaxLength="7" Width="50px" Text='<%# Bind("MobPh") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Loc.TA">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_ta" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_LocTA" runat="server" CssClass="normalText2" MaxLength="7" onblur="GetTotal(this)" Width="50px" Text='<%# Bind("TA") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="Hardship">
    
                            <FooterTemplate>
    
                                <asp:Label ID="lbl_tot_hsip" runat="server" CssClass="tablehead2" ForeColor="White"></asp:Label>
    
                            </FooterTemplate>
    
                            <ItemTemplate>
    
                                <asp:TextBox ID="Txt_HardShip" runat="server" CssClass="normalText2" MaxLength="7" onblur="GetTotal(this)" Width="50px" Text='<%# Bind("Hardship") %>'></asp:TextBox>
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:TemplateField HeaderText="+">
    
                            <ItemTemplate>
    
                                <asp:ImageButton ID="ImgBtn_Prj_Yes" runat="server" CausesValidation="false" Height="21px" ImageUrl="image/add.jfif" OnClick="Project_Grid_AddtlRow" Width="21px" />
    
                            </ItemTemplate>
    
                        </asp:TemplateField>
    
                        <asp:CommandField ButtonType="Image" DeleteImageUrl="image/small.jfif" HeaderText="-" ItemStyle-CssClass="smalltext" ShowDeleteButton="True">
    
                            <ItemStyle CssClass="smalltext" />
    
                        </asp:CommandField>
    
                    </Columns>
    
                    <EditRowStyle BackColor="#999999" />
    
                    <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    
                    <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
    
                    <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
    
                    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
    
                    <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
    
                    <SortedAscendingCellStyle BackColor="#E9E7E2" />
    
                    <SortedAscendingHeaderStyle BackColor="#506C8C" />
    
                    <SortedDescendingCellStyle BackColor="#FFFDF8" />
    
                    <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
    
                </asp:GridView>

    Result:

    Best regards,

    Yijing Sun

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, December 17, 2019 9:31 AM
  • User-582711651 posted

    Hi Yij Sun, 

    Excellent, I have added a few things;

    pls ref.

    unction GetTotal() {
    
                var gr_tot = 0;
                var total_tot = 0;
                var c_grsal = 0;
                var c_mobph = 0;
                var c_locta = 0;
                var c_hrshp = 0;
    
                var t_grsal = 0;
                var t_mobph = 0;
                var t_locta = 0;
                var t_hrshp = 0;
    
                var grid = document.getElementById("Grv_ProjectBooking");
    
                if (grid.rows.length > 0) {
                    var inputs = grid.getElementsByTagName("input");
                    var i = 0;
                    var rx = 0;
                    i = (rx + i);
                    var grl = (grid.rows.length - 1);
                    for (var r = 1; r < grl; r++) {
                        if (inputs[i].name.indexOf('Txt_GrSalary') > 0) {
                            if (inputs[i].value != "") {
                                gr_tot = gr_tot + parseInt(inputs[i].value);
                                t_grsal = parseInt(inputs[i].value);
                            }  else {
                                   t_grsal = 0
                               }
                        }
                        rx = (rx + 1);
                        i = (rx);
                        if (inputs[i].name.indexOf("Txt_MobAllow") > 0) {
                            if (inputs[i].value != "") {
                                t_mobph = parseInt(inputs[i].value);
                           } else {
                                   t_mobph = 0
                               }
    
                        }
                        rx = (rx + 1);
                        i = (rx);
     
                        if (inputs[i].name.indexOf("Txt_LocTA") > 0) {
                            if (inputs[i].value != "") {
                                t_locta = parseInt(inputs[i].value);
                            } else {
                                   t_locta = 0
                               }
                        }
    
                        rx = (rx + 1);
                        i = (rx);
    
                        if (inputs[i].name.indexOf("Txt_HardShip") > 0) {
                            if (inputs[i].value != "") {
                                t_hrshp = parseInt(inputs[i].value);
                            } else {
                                   t_hrshp = 0
                               }
                        }
    
                       rx = (rx + 1);
                        i = (rx);
    
    
                        c_grsal += t_grsal;
                        c_mobph += t_mobph;
                        c_locta += t_locta;
                        c_hrshp += t_hrshp;
    
                        $("[id*=lbl_tot_grsal]").html(c_grsal.toString());
                        $("[id*=lbl_tot_moballow]").html(c_mobph.toString());
                        $("[id*=lbl_tot_ta]").html(c_locta.toString());
                        $("[id*=lbl_tot_hsip]").html(c_hrshp.toString());
    
                        rx = (rx + 2);
                        i = 0;
                        i = (rx);
                    } 
    
                        gr_tot = (c_grsal + c_mobph + c_locta + c_hrshp);
    
                        $("[id*=lbl_grtot]").html("Total:" + gr_tot.toString());
                }
                        }

    Thanks a lot.

    :)

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, December 17, 2019 11:50 AM