Click here to Skip to main content
15,886,137 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hello Friends !!

How to Merge cells in Asp.net GridView Footer ?
This project to used to enter students Marks using Gridview footer
am working on gridview, This gridview has 6 columns.
In this gridview I have Textboxes and a add button in footer to add the records. This is working fine till here.
Now I want to add one more Large Textbox in footer to Enter the Remarks for this particular record.

So, My requirement is, this textbox should cover all the 6 columns,(I mean it should Merge)
It should Merge 6 columns into one row
This is my design code.
XML
<asp:GridView ID="GVUserEntry" runat="server" Width="1070px" AllowPaging="True" CssClass="GVFontVIP" 
                    CellPadding="4" HorizontalAlign="Center" ShowFooter="True" 
                    AutoGenerateColumns="False" 
                    onpageindexchanging="GVUserEntry_PageIndexChanging" 
                    onrowcancelingedit="GVUserEntry_RowCancelingEdit" 
                    onrowcommand="GVUserEntry_RowCommand" onrowdatabound="GVUserEntry_RowDataBound" 
                    onrowdeleting="GVUserEntry_RowDeleting" onrowediting="GVUserEntry_RowEditing" 
                    onrowupdating="GVUserEntry_RowUpdating" BackColor="White" 
                    BorderColor="#336666" BorderStyle="Double" BorderWidth="3px" 
                    DataKeyNames="Id,FlightNo" PageSize="20" 
                    onrowcreated="GVUserEntry_RowCreated">
                    <rowstyle horizontalalign="Center" backcolor="White" forecolor="#333333" cssclass="GVRowsUpperCase" />
 <columns>
<asp:TemplateField>
<HeaderStyle Width="30px" />
<itemstyle width="30px" />
<edititemtemplate>
<asp:ImageButton ID="imgbtnUpdate" CommandName="Update" runat="server" ImageUrl="~/Images/update.jpg" ToolTip="Update" Height="20px" Width="20px" />
<asp:ImageButton ID="imgbtnCancel" runat="server" CommandName="Cancel" ImageUrl="~/Images/Cancel.jpg" ToolTip="Cancel" Height="20px" Width="20px" />
</edititemtemplate>
<itemtemplate>
<asp:ImageButton ID="imgbtnEdit" CommandName="Edit" runat="server" ImageUrl="~/Images/Edit.jpg" ToolTip="Edit" Height="20px" Width="20px" />
</itemtemplate>
<footertemplate>
<asp:ImageButton ID="imgbtnAdd" runat="server" ImageUrl="~/Images/AddNewitem.jpg" CommandName="AddNew" Width="30px" Height="30px" ToolTip="Add" ValidationGroup="validaiton" />
</footertemplate> 
 
<asp:TemplateField HeaderText="Student Name">
<HeaderStyle Width="85px" />
<itemstyle width="85px" />
<edititemtemplate>
<asp:TextBox ID="txtStudentName" runat="server" Width="85px" Text='<%#Eval("StudentName") %>'/>
</edititemtemplate>
<itemtemplate>
<asp:Label ID="lblitemStudentName" runat="server" Text='<%#Eval("StudentName") %>'/>
</itemtemplate>
<footertemplate>
<asp:TextBox ID="txtftrStudentName" runat="server" Width="85px"/>
<asp:RequiredFieldValidator ID="rfvStudentName" runat="server" ControlToValidate="txtftrStudentName" Text="*" ValidationGroup="validation"/>
</footertemplate> 


 <asp:TemplateField HeaderText="English" >
 <edititemtemplate>
 <asp:TextBox ID="txtEnglish" runat="server" Width="85px" Text='<%#Eval("English") %>'/>
 </edititemtemplate>
 <itemtemplate>
 <asp:Label ID="lblEnglish" runat="server" Text='<%#Eval("English") %>'/>
 </itemtemplate>
 <footertemplate>
 <asp:TextBox ID="txtftrEnglish" runat="server" Width="85px"/>
 <asp:RequiredFieldValidator ID="rfvEnglish" runat="server" ControlToValidate="txtftrEnglish" Text="*" ValidationGroup="validation"/>
 </footertemplate>
 <HeaderStyle Width="85px" />
 <itemstyle width="85px"></itemstyle>
 
 <asp:TemplateField HeaderText="Hindi">
 <edititemtemplate>
 <asp:TextBox ID="txtHindi" Width="85px" runat="server" Text='<%#Eval("Hindi") %>'/>
 </edititemtemplate>
 <itemtemplate>
 <asp:Label ID="lblHindi" runat="server" Text='<%#Eval("Hindi") %>'/>
 </itemtemplate>
 <footertemplate>
 <asp:TextBox ID="txtftrHindi" runat="server" Width="85px"/>
  <asp:RequiredFieldValidator ID="rfvHindi" runat="server" ControlToValidate="txtftrHindi" Text="*" ValidationGroup="validation"/>
 </footertemplate>
 <HeaderStyle Width="85px" />
 <itemstyle width="85px"></itemstyle>
 
 <asp:TemplateField HeaderText="Mathematics">
 <edititemtemplate>
 <asp:TextBox ID="txtMathematics" runat="server" MaxLength="4" Width="85px" Text='<%#Eval("Mathematics") %>'/>
 </edititemtemplate>
 <itemtemplate>
 <asp:Label ID="lblMathematics" runat="server" Text='<%#Eval("Mathematics") %>'/>
 </itemtemplate>
 <footertemplate>
 <asp:TextBox ID="txtftrMathematics" runat="server" MaxLength="4" Width="85px"/>
  <asp:RequiredFieldValidator ID="rfvMathematics" runat="server" ControlToValidate="txtftrMathematics" Text="*" ValidationGroup="validation"/>
 </footertemplate>
 <HeaderStyle Width="85px" />
 <itemstyle width="85px"></itemstyle> 
 
 <asp:TemplateField HeaderText="Science">
 <edititemtemplate>
 <asp:TextBox ID="txtScience" runat="server" Width="85px" Text='<%#Eval("Science") %>'/>
 </edititemtemplate>
 <itemtemplate>
 <asp:Label ID="lblScience" runat="server" Text='<%#Eval("Science") %>'/>
 </itemtemplate>
 <footertemplate>
 <asp:TextBox ID="txtftrScience" runat="server" Width="85px"/>
  <asp:RequiredFieldValidator ID="rfvScience" runat="server" ControlToValidate="txtftrScience" Text="*" ValidationGroup="validation"/>
 </footertemplate>
 <itemstyle width="85px"></itemstyle>
 
 <asp:TemplateField HeaderText="Social">
 <edititemtemplate>
 <asp:TextBox ID="txtSocial" runat="server" Width="85px" Text='<%#Eval("Social") %>'/>
 </edititemtemplate>
 <itemtemplate>
 <asp:Label ID="lblSocial" runat="server" Text='<%#Eval("Social") %>'/>
 </itemtemplate>
 <footertemplate>
 <asp:TextBox ID="txtftrSocial" runat="server" Width="85px"/>
  <asp:RequiredFieldValidator ID="rfvSocial" runat="server" ControlToValidate="txtftrSocial" Text="*" ValidationGroup="validation"/>
 </footertemplate>
 <HeaderStyle Width="85px" />
 <itemstyle width="85px"></itemstyle> 
  </columns>

<footerstyle backcolor="White" forecolor="#333333" />
<pagerstyle backcolor="#336666" forecolor="White" horizontalalign="Center" />
 <SelectedRowStyle HorizontalAlign="Center" BackColor="#339966" Font-Bold="True" ForeColor="White" /> 
 <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" HorizontalAlign="Center"  CssClass="HeaderStyleVIP"></HeaderStyle>

Please can you show me, how to merge 6 columns to one row in Gridview Footer.

Thanks in ADVANCE.
Posted
v3
Comments
HYD Webdeveloper 11-Feb-13 3:07am    
hi experts ! am unable to see your updated answer.
Dimple Kumar Sharma 11-Feb-13 4:49am    
hello !!
Try this,

<pre lang="vb"> If (e.Row.RowType = DataControlRowType.Footer)
{
GVUserEntry.FooterRow.Cells(0).ColumnSpan = 7
GVUserEntry.FooterRow.Cells.RemoveAt(1)
GVUserEntry.FooterRow.Cells.RemoveAt(2)
GVUserEntry.FooterRow.Cells.RemoveAt(3)
GVUserEntry.FooterRow.Cells.RemoveAt(4)
GVUserEntry.FooterRow.Cells.RemoveAt(5)
GVUserEntry.FooterRow.Cells.RemoveAt(6)
}

</pre>


Thanks & Happy Coding..

hello !!
Try this,

VB
gvitems.FooterRow.Cells(0).ColumnSpan = 7
gvitems.FooterRow.Cells.RemoveAt(1)
gvitems.FooterRow.Cells.RemoveAt(2)
gvitems.FooterRow.Cells.RemoveAt(3)
gvitems.FooterRow.Cells.RemoveAt(4)
gvitems.FooterRow.Cells.RemoveAt(5)
gvitems.FooterRow.Cells.RemoveAt(6)



Thanks & Happy Coding..
 
Share this answer
 
try this small demo..in it first footer is added design time and second footer is added dynamicaly....then try to implement in ur code
.aspx file is
XML
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="GridView1" ShowFooter="True" runat="server" Width="421px"
            onrowdatabound="GridView1_RowDataBound" >
            <Columns>
                <asp:TemplateField>
                <ItemTemplate>
                <%# Eval("name") %>
                </ItemTemplate>
                <FooterTemplate>
                foot one
                </FooterTemplate>
                </asp:TemplateField>

            </Columns>

        </asp:GridView>
    </div>
    </form>
</body>

.cs file is as follow...in GridView1_RowDataBound in cell i textbox is added dynamicaly runtime by merging secound column in it
protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            bind();

             
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        GridViewRow gvr = e.Row;
        if (e.Row.RowType == DataControlRowType.Footer)
        {
            int index = GridView1.Rows.Count;
            GridViewRow row = new GridViewRow(0, 0, DataControlRowType.Footer, DataControlRowState.Normal);
            TableCell cell = new TableCell();
            TextBox txt = new TextBox();
            txt.Width = 350;
            cell.Controls.Add(txt);
            TableCell cell2 = new TableCell();
            row.Cells.Add(cell);
            row.Cells.Add(cell2);
            row.Cells[0].ColumnSpan = 3;
            row.Cells[1].Visible = false;
            GridView1.Controls[0].Controls.Add(row);

         
        }
    }

    private void bind()
    {
        DataTable table = new DataTable();
        table.Columns.Add("name");

        DataRow dr = table.NewRow();
        dr["name"] = "rowa";
        table.Rows.Add(dr);

        DataRow dr2 = table.NewRow();
        dr2["name"] = "rowa";
        table.Rows.Add(dr2);

        this.GridView1.DataSource = table;
        this.GridView1.DataBind();

    }

hope it will help u
 
Share this answer
 
C#
if (e.Row.RowType = DataControlRowType.Footer)
{
    // Set the span
    GVUserEntry.FooterRow.Cells(0).ColumnSpan = 7

    // Remove the spanned columns. *Don't* remove
    // 1, then 2, then 3 etc as you'll eventually
    // overflow the bounds!
    for(int i = 0; i < 6; i++)
        GVUserEntry.FooterRow.Cells.RemoveAt(1)
}
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900