GridView - trouble with double header row RSS

• • Reply
  

  gabzsa

  0 Points

  3 Posts

  GridView - trouble with double header row

  Dec 29, 2006 01:45 PM|LINK

  Hi everyone!

  I am trying to make a table with a header something like this:

   

  +---------------------------+
  |      |      |      Day    |
  | Task | Name |-------------|
  |      |      |0|1|2|3|4|5|6|
  +------+------+-+-+-+-+-+-+-+
  |      |      | | | | | | | |

     I am trying to do it with GridView, because I need to be able to edit these lines, etc. After several hours I figured out how to add a new header row into the GridView, and set the Task and Name column's cell rowspan to achieve the above results. Inserting a new header row, and adding dynamic number of additional cells to each row (since I don't know how many days will be there design-time)

   

  protected void BacklogGridView_RowDataBound(object sender, GridViewRowEventArgs e)
      {
          int cellcount = e.Row.Cells.Count;
          int days = items[0].Estimates.Count - 1;  //items is the business object
          GridView gv = sender as GridView;
          if (e.Row.RowType == DataControlRowType.Header)
          {
              for (int i = 0; i <= cellcount - 2; ++i)
              {
                  e.Row.Cells[i].RowSpan = 2;
              }
              e.Row.Cells[cellcount-1].ColumnSpan = days + 1; 
             
              if (gv.HasControls())
              {
                  GridViewRow tr = new GridViewRow(0, -1, DataControlRowType.Header, DataControlRowState.Normal);
                  for (short i = 0; i <= days; ++i)
                  {
                      TableCell td = new TableCell();
                      td.Text = i.ToString();
                      tr.Cells.Add(td);
                  }
                  ((Table)gv.Controls[0]).Rows.Add(tr);
              }
          }
          else if (e.Row.RowIndex != -1)
          {
              e.Row.Cells[cellcount - 1].Text = items[e.Row.RowIndex].Estimates[0].ToString();;
              if (l!=null) l.Text = items[e.Row.RowIndex].Estimates[0].ToString();
              for (short i = 1; i <= days; ++i)
              {
                  TableCell td = new TableCell();
                  td.Text = items[e.Row.RowIndex].Estimates[i].ToString();
                  e.Row.Cells.Add(td);
              }   
          }
      }

     However I am facing some new problems with this. First of all, when  I click on a commandfield's edit button, and accept the changes, the rowupdating event won't fire, instead, it jumps to the next row, as if I had clicked the edit there. Secondly, since I dont know how many days will I have in design time, I have to use the above method to add new cells to each row, corresponding to the number of days from the data source. This leads to a situation, where I have no control over these cells, since they are just dumb table cells, and cannot be edited in same way as they would be BoundFields. Any ideas? 
• • Reply
  

  rojay12

  Contributor

  4065 Points

  738 Posts

  Re: GridView - trouble with double header row

  Dec 30, 2006 01:24 AM|LINK

  the second is tricky, let me stew on that. the first i suspect is because you have added the second header everything is off on. that RowIndex is off by one.  I onder if you perform a RowIndex-1 on the updates/edit you might find some luck.
  Jared Roberts
  Lead Application Developer
• • Reply
  

  gabzsa

  0 Points

  3 Posts

  Re: GridView - trouble with double header row

  Dec 30, 2006 09:18 AM|LINK

  Thanks for the reply.

  Unfortunately, the RowIndex is not the root of the problem, as I could verify that both DataItemIndex and Rowindex gets incremented in for each non-header row, starting from 0. 

• • Reply
  

  sciszewski

  Member

  82 Points

  21 Posts

  Re: GridView - trouble with double header row

  Dec 30, 2006 06:18 PM|LINK

  I wonder if this would work (I've done it for other reasons).

  First, you have to change the approach slightly. Have the header rows built separately in a table. Then have the editable gridview in a div tag below the header table. One of the results of doing it this way is you can easily implement the "frozen" header effect (which may work in your favor). I think this solves any editing issues because the gridview only contains the data. The only downside is the formatting is difficult to align between the header table and the gridview.

  
   

• • Reply
  

  etariq

  Contributor

  2823 Points

  514 Posts

  Re: GridView - trouble with double header row

  Dec 31, 2006 10:05 PM|LINK

  http://www.codeproject.com/useritems/TariqMultiHeaderGridview.asp

  this is a multiHeader Function u please folow the link it may help

   

  A fine is a tax for doing wrong. A tax is a fine for doing well.
  __________________________________________________
  Please remember to click “Mark as Answer” on the post that helps you.
• • Reply
  

  gabzsa

  0 Points

  3 Posts

  Re: GridView - trouble with double header row

  Jan 01, 2007 02:30 PM|LINK

  Thanks, I've already found this article, but it doesn't help me. The main problem is how to render dynamic number of columns (the exact number is known only from the data source) so that they are  editable, sortable, etc AND have multiple headers for these columns.
  

  This article only deals with the latter problem. I can solve the first problem too, but I don't see how can I deal with both of them at the same time.

  The suggestion to use two tables one for the header and one for the content might do it, but it is quite a hacky solution. 

• • Reply
  

  etariq

  Contributor

  2823 Points

  514 Posts

  Re: GridView - trouble with double header row

  Jan 04, 2007 06:45 AM|LINK

  i think it the event that its cozing ur Problems

  protected void BacklogGridView_RowDataBound

  i think it should be the rowcreated event

  try it

   

  A fine is a tax for doing wrong. A tax is a fine for doing well.
  __________________________________________________
  Please remember to click “Mark as Answer” on the post that helps you.
• • Reply
  

  Moshiur.Rahm...

  Member

  2 Points

  1 Post

  Re: GridView - trouble with double header row

  Jul 04, 2008 05:14 PM|LINK

  Hi,

  i have solved the problem in this way-

  Default.aspx

   

  <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <form id=form1 runat="server"> <div>

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml">

  <head runat="server">

  <title>Untitled Page</title>

  </head>

  <body>

  <form id="form1" runat="server">

  <div>

  <asp:GridView

  ID="GridView1"

  runat="server"

  AutoGenerateColumns="False"

  OnRowCancelingEdit="GridView1_RowCancelingEdit"

  OnRowDeleting="GridView1_RowDeleting"

  OnRowEditing="GridView1_RowEditing"

  OnRowUpdating="GridView1_RowUpdating"

  BorderWidth="1px"

  CellPadding="1"

  CellSpacing="1"

  ShowHeader="false">

  <Columns>

  <asp:TemplateField HeaderText="Customer ID" Visible="true">

  <ItemTemplate>

  <asp:Label ID="lblCustomerIDItem" BorderWidth="0" runat="server" Text='<%# Bind("CustomerID") %>'></asp:Label>

  <asp:HiddenField ID="hiddenCustomerID" runat="server" Value='<%# Bind("CustomerID") %>'></asp:HiddenField>

  </ItemTemplate>

  <ItemStyle HorizontalAlign="Left" Width="90px" />

  </asp:TemplateField>

   

  <asp:TemplateField HeaderText="Name" >

  <EditItemTemplate>

  <asp:TextBox ID="txtNameEdit" runat="server" Text='<%# Bind("Name") %>'></asp:TextBox>

  </EditItemTemplate>

  <ItemTemplate>

  <asp:Label ID="lblNameItem" runat="server" Text='<%# Bind("Name") %>'></asp:Label>

  </ItemTemplate>

  </asp:TemplateField>

   

  <asp:TemplateField HeaderText="Email" >

  <EditItemTemplate>

  <asp:TextBox ID="txtEmailEdit" runat="server" Text='<%# Bind("Email") %>'></asp:TextBox>

  </EditItemTemplate>

  <ItemTemplate>

  <asp:Label ID="lblEmailItem" runat="server" Text='<%# Bind("Email") %>'></asp:Label>

  </ItemTemplate>

  </asp:TemplateField>

   

  <asp:TemplateField HeaderText="Phone Number" >

  <EditItemTemplate>

  <asp:TextBox ID="txtPhoneNumberEdit" runat="server" Text='<%# Bind("PhoneNumber") %>'></asp:TextBox>

  </EditItemTemplate>

  <ItemTemplate>

  <asp:Label ID="lblPhoneNumberItem" runat="server" Text='<%# Bind("PhoneNumber") %>'></asp:Label>

  </ItemTemplate>

  </asp:TemplateField>

   

  <asp:TemplateField ShowHeader="False">

  <EditItemTemplate>

  <asp:LinkButton ID="LinkButton1" runat="server" ValidationGroup="NoV" CausesValidation="True"

  CommandName="Update" Text="Update"></asp:LinkButton>

  <asp:LinkButton ID="LinkButton2" runat="server" CausesValidation="False" CommandName="Cancel"

  Text="Cancel"></asp:LinkButton>

  </EditItemTemplate>

  <ItemTemplate>

  <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Edit"

  Text="Edit"></asp:LinkButton>

  </ItemTemplate>

  </asp:TemplateField>

  </Columns>

  </asp:GridView>

  </div>

  </form>

  </body>

  </html>

   

  Default.aspx.cs

  using System;

  using System.Data;

  using System.Configuration;

  using System.Collections;

  using System.Web;

  using System.Web.Security;

  using System.Web.UI;

  using System.Web.UI.WebControls;

  using System.Web.UI.WebControls.WebParts;

  using System.Web.UI.HtmlControls;

  public partial class _Default : System.Web.UI.Page

  {

  protected void Page_Load(object sender, EventArgs e)

  {

  if (!IsPostBack)

  {

  LoadGridView();

  }

  }

  protected void LoadGridView()

  {

  DataSet1.CustomerDataTable dt = (new DataSet1TableAdapters.CustomerTableAdapter()).GetData();

  GridView1.DataSource = dt;

  GridView1.DataBind();

  AddExtraHeader();

  }

  protected void GridView1_RowUpdating(object sender, GridViewUpdateEventArgs e)

  {

  HiddenField hiddenCustomerID = (HiddenField)GridView1.Rows[e.RowIndex].FindControl("hiddenCustomerID");

  TextBox txtNameEdit = (TextBox)GridView1.Rows[e.RowIndex].FindControl("txtNameEdit");

  TextBox txtEmailEdit = (TextBox)GridView1.Rows[e.RowIndex].FindControl("txtEmailEdit");

  TextBox txtPhoneNumberEdit = (TextBox)GridView1.Rows[e.RowIndex].FindControl("txtPhoneNumberEdit");

  (new DataSet1TableAdapters.CustomerTableAdapter()).Update(txtNameEdit.Text, txtEmailEdit.Text, txtPhoneNumberEdit.Text, Int32.Parse(hiddenCustomerID.Value));

  this.GridView1.EditIndex = -1;

  this.LoadGridView();

  }

  protected void GridView1_RowEditing(object sender, GridViewEditEventArgs e)

  {

  this.GridView1.EditIndex = e.NewEditIndex;this.LoadGridView();

  }

  protected void GridView1_RowCancelingEdit(object sender, GridViewCancelEditEventArgs e)

  {

  this.GridView1.EditIndex = -1;

  this.LoadGridView();

  }

  protected void GridView1_RowDeleting(object sender, GridViewDeleteEventArgs e)

  {

  this.LoadGridView();

  }

  public void AddExtraHeader()

  {

  // creating the first row in header

  SortedList cellSortedList = new SortedList();

  cellSortedList.Add("1", "<h5>ID</h5>,1,2");

  cellSortedList.Add("2", "<h5>Customer Name</h5>,1,2");

  cellSortedList.Add("3", "<h5>Contact Information</h5>,2,1");

  cellSortedList.Add("4", "<h5></h5>,1,1");

  IDictionaryEnumerator enumCells = cellSortedList.GetEnumerator();

  GridViewRow row = new GridViewRow(-1, -1, DataControlRowType.Header, DataControlRowState.Normal);while (enumCells.MoveNext())

  {

  string[] cont = enumCells.Value.ToString().Split(Convert.ToChar(","));

  TableCell Cell;

  Cell = new TableCell();

  Cell.RowSpan = Convert.ToInt16(cont[2].ToString());

  Cell.ColumnSpan = Convert.ToInt16(cont[1].ToString());

  Cell.Controls.Add(new LiteralControl(cont[0].ToString()));

  Cell.HorizontalAlign = HorizontalAlign.Center;

  Cell.ForeColor = System.Drawing.Color.Black;

  row.Cells.Add(Cell);

  }

  GridView1.HeaderRow.Parent.Controls.AddAt(0, row);

   

  // creating the second row in header

  cellSortedList = new SortedList();

  cellSortedList.Add("1", "<h5>Email</h5>,1,1");

  cellSortedList.Add("2", "<h5>Phone Number</h5>,1,1");cellSortedList.Add("3", "<h5></h5>,1,1");

  enumCells = cellSortedList.GetEnumerator();

  row = new GridViewRow(-1, -1, DataControlRowType.Header, DataControlRowState.Normal);

  while (enumCells.MoveNext())

  {

  string[] cont = enumCells.Value.ToString().Split(Convert.ToChar(","));

  TableCell Cell;

  Cell = new TableCell();

  Cell.RowSpan = Convert.ToInt16(cont[2].ToString());

  Cell.ColumnSpan = Convert.ToInt16(cont[1].ToString());

  Cell.Controls.Add(new LiteralControl(cont[0].ToString()));

  Cell.HorizontalAlign = HorizontalAlign.Center;Cell.ForeColor = System.Drawing.Color.Black;

  row.Cells.Add(Cell);

  }

   

  GridView1.HeaderRow.Parent.Controls.AddAt(1, row);

  }

  }

   

  Thanks,

  Moshiur Rahman Reza

  </div></form>
• • Reply
  

  babuji_godem

  Member

  109 Points

  57 Posts

  Re: GridView - trouble with double header row

  Feb 24, 2009 06:54 AM|LINK

   http://www.codeplex.com/ASPNetRealWorldContr

  Babuji Godem
  Human Logic Pvt Ltd.