This is a migrated thread and some comments may be shown as answers.

Dynamically generated multicolumn headers: top header disappears after postback

9 Answers 389 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Marliela
Top achievements
Rank 1
Marliela asked on 05 Jul 2012, 02:08 PM
Hi,

I'm using the multicolumn headers feature of the RadGrid control, and generate the multicolumn headers dynamically. Unfortunately the top header disappears after a postback. When I refresh the page, the top header is back again.

My aspx:
<table>
    <tr><td>Start date*</td>
        <td><telerik:RadDatePicker ID="RadDatePicker1" runat="server" EnableScreenBoundaryDetection="false">
                <DateInput DisplayDateFormat="d-M-yyyy"></DateInput>
                <DatePopupButton ToolTip="Open de kalender"></DatePopupButton>
            </telerik:RadDatePicker></td>
        <td>End date*</td>
        <td><telerik:RadDatePicker ID="RadDatePicker2" runat="server" EnableScreenBoundaryDetection="false">
                <DateInput DisplayDateFormat="d-M-yyyy"></DateInput>
                <DatePopupButton ToolTip="Open de kalender"></DatePopupButton>
            </telerik:RadDatePicker></td>
        <td><telerik:RadButton ID="DatumButton" runat="server" Text="Ok"
                onclick="DatumButton_Click">
            </telerik:RadButton>
        </td>
    </tr>
</table>
 
<telerik:RadGrid ID="RadGrid1" runat="server" OnNeedDataSource="RadGrid1_NeedDataSource" AutoGenerateColumns="False" CellSpacing="0" GridLines="None" OnSelectedCellChanged="RadGrid1_SelectedCellChanged">
    <MasterTableView DataKeyNames="myDataKeyName">
    </MasterTableView>
    <ClientSettings EnablePostBackOnRowClick="true" >
        <Selecting CellSelectionMode="SingleCell" />
    </ClientSettings>
</telerik:RadGrid>

My Code behind:
protected void Page_Load(object sender, EventArgs e)
        {
            if (RadDatePicker1.SelectedDate == null)
            {
                RadDatePicker1.SelectedDate = DateTime.Today;
            }
 
            if (RadDatePicker2.SelectedDate == null)
            {
                RadDatePicker2.SelectedDate = DateTime.Today.AddDays(6);
            }
             
            if (!Page.IsPostBack)
            {
                GetGrid();
            }
        }
 
        protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e)
        {
            RadGrid1.DataSource = GetMyDataList();
        }
 
        protected void RadGrid1_SelectedCellChanged(object sender, EventArgs e)
        {
            GridTableCell d = RadGrid1.SelectedCells[0];
 
            if (d.Text == "1")
            {
                d.Text = " ";
            }
            else
            {
                d.Text = "1";
            }
 
            d.Selected = false;
        }
 
        private void GetGrid()
        {
            DateTime startDate = Convert.ToDateTime(RadDatePicker1.SelectedDate);
            DateTime endDate = Convert.ToDateTime(RadDatePicker2.SelectedDate);
 
            GridBoundColumn cCode = new GridBoundColumn();
            RadGrid1.MasterTableView.Columns.Add(cCode);
            cCode.HeaderText = "Code";
            cCode.DataField = "Code";
            cCode.UniqueName = "Code";
            cCode.ReadOnly = true;
            cCode.ItemStyle.Width = 50;
 
            GridBoundColumn cDescription = new GridBoundColumn();
            RadGrid1.MasterTableView.Columns.Add(cDescription);
            cDescription.HeaderText = "Description";
            cDescription.DataField = "Description";
            cDescription.UniqueName = "Description";
            cDescription.ReadOnly = true;
            cDescription.ItemStyle.Width = 250;
 
            while (startDate <= endDate)
            {
                string day = startDate.ToString("dddd").Substring(0, 2);
                string date = startDate.ToString("dd-MM");
 
                GridColumnGroup columnGroup = new GridColumnGroup();
 
                columnGroup.HeaderText = string.Format("{0} {1}", day, date);
                columnGroup.Name = startDate.ToString("yyyyMMdd");
 
                RadGrid1.MasterTableView.ColumnGroups.Add(columnGroup);
                List<MyList> listMyList = GetMyList();
                for (int i = 0; i < listMyList.Count; i++)
                {
                    GridBoundColumn column = new GridBoundColumn();
                    RadGrid1.MasterTableView.Columns.Add(column);
                    column.HeaderText = listMyList.ElementAt(i).myElement;
                    column.UniqueName = listMyList.ElementAt(i).myElement + "_" + startDate.ToString("yyyyMMdd");
                    column.ColumnGroupName = startDate.ToString("yyyyMMdd");
                    column.DataField = " ";
                    column.ItemStyle.Width = 50;
                }
                startDate = startDate.AddDays(1);
            }
        }

When I took the GetGrid function out of the if(!Page.IsPostback), the behavior of the grid did not change. The top header still disappears after a postback, but not after a refresh.

Can you please help me solve this? Thanks!

9 Answers, 1 is accepted

Sort by
0
Accepted
Eyup
Telerik team
answered on 10 Jul 2012, 11:53 AM
Hello Marlies,

We are aware of this issue which is related to the ViewState. Our developers will further inspect this behavior and provide a proper fix as soon as possible.

Currently, you will need to create your grid entirely in the code-behind. I have created a sample RadGrid web site using the provided code samples. Please find the attached application and try to make the suggested modifications.

Regards,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Marliela
Top achievements
Rank 1
answered on 11 Jul 2012, 07:13 AM
Hi Eyup,

Thanks for your reply, creating the grid entirely in the code-behind solves the problem!

Marlies
0
Les
Top achievements
Rank 1
answered on 12 Jul 2012, 11:14 AM
I had the same issue. This helps.
Thanks!
0
Kumar
Top achievements
Rank 1
answered on 31 Jul 2012, 06:45 AM
Hi,
I am having a problem with radgrid.the problem is

I am having grid calling the method to bind in initialise  and after that when i clicked the button means the grid appears the header value disappers.Please help me.
0
Eyup
Telerik team
answered on 02 Aug 2012, 06:40 AM
Hello Kumar,

Could you please verify that you are correctly following the steps provided in the following help topic?
 Programmatic Creation

Kind regards,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Herin
Top achievements
Rank 1
answered on 15 Nov 2013, 08:26 PM
Hello,
          I have created RadGrid programmatically. How can i change the background color of particular header group. I have three multi-column header group, and i want to change the background of all three header group different. How can i do this uaing  Programmatically ?
0
Princy
Top achievements
Rank 1
answered on 18 Nov 2013, 11:21 AM
Hi Herin,

Please try the following code snippet to set the background color for the MultiColumnHeaders. You can set the HeaderStyle property of the headers.

CSS:
<style type="text/css">
 .headerRed
    {
        background: red !important;
    }
</style>

C#:
GridColumnGroup columnGroup = new GridColumnGroup();
columnGroup.Name = "MainHeader";
columnGroup.HeaderText = "HeaderName";   
columnGroup.HeaderStyle.CssClass = "headerRed";
RadGrid1.MasterTableView.ColumnGroups.Add(columnGroup);

Thanks,
Princy
0
RJ
Top achievements
Rank 1
answered on 19 Dec 2016, 12:15 PM

Hi All,

My grid disappears when I click pager buttons.

Any idea or workaround fix for the issue?

Thanks in Advance!

RJ

0
RJ
Top achievements
Rank 1
answered on 18 Jan 2017, 10:45 AM
Got it
Tags
Grid
Asked by
Marliela
Top achievements
Rank 1
Answers by
Eyup
Telerik team
Marliela
Top achievements
Rank 1
Les
Top achievements
Rank 1
Kumar
Top achievements
Rank 1
Herin
Top achievements
Rank 1
Princy
Top achievements
Rank 1
RJ
Top achievements
Rank 1
Share this question
or