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

Problem working with dynamically created RadGrid's

7 Answers 349 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Remco
Top achievements
Rank 1
Remco asked on 04 Dec 2011, 12:57 PM
Hello,

We want to create a WebForm with a RadGrid that should be able to show different datasources.  I started out with http://www.telerik.com/help/aspnet-ajax/grid-changing-structure-dynamically.html help page, that explains how to dynamically create a grid structure. To be more flexible I used the NeedDataSource event handling, and everything works reasonably well. For this I got some helpful info from the http://www.telerik.com/community/forums/aspnet-ajax/grid/grid-dynamically-needs-different-datasources-needdatasource-can-t-do-this.aspx forum page.

However I have two issues I'm unable to solve. 

1) If the user changes a column width and then switch to a different datasource we get a 'Cannot find a column with UniqueName '...' error. This is because it still refers to the previous grid layout. What code changes should I make to fix this?

2) I want to save the width of columns and the sort columns. But as the RadGrid is created dynamically in the Page_Init I don't have a clue how and when I should save the grid layout.

I  added  a small sample, based on the Northwind database, to show my current solution. Can someone instruct me how to solve my problems?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm9.aspx.cs" Inherits="WebApplication3.WebForm9"  Trace="false" %>
 
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<head id="Head1" runat="server">
    <title></title>
</head>
 
<body class="BODY">
    <form runat="server" id="mainForm" method="post">
 
        <telerik:RadScriptManager ID="RadScriptManager" runat="server"></telerik:RadScriptManager>
        <!-- content start -->
 
        <!-- Rad Ajax Manager -->       
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
 
 
        <div id="menu" style="height:30px; margin-top:10px;">
            <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"
                onselectedindexchanged="DropDownList1_SelectedIndexChanged">
                <asp:ListItem>customers</asp:ListItem>
                <asp:ListItem>orders</asp:ListItem>
            </asp:DropDownList>
        </div>
        <br />
 
        <div id="DivGrid1" style="height:200px; margin-top:10px;" >
 
            <telerik:RadGrid ID="RadGrid1" runat="server" >
            </telerik:RadGrid>
 
        </div>
 
        <!-- content end -->
    </form>
</body>
</html>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Configuration;
using System.Data.SqlClient;
using Telerik.Web.UI;
 
namespace WebApplication3
{
 
   public partial class WebForm9 : System.Web.UI.Page
   {
 
      myListview pageGrid = new myListview();
      List<myListviewColumn> gridColumn = new List<myListviewColumn>();
 
      protected void Page_Init(object sender, System.EventArgs e)
      {
         Grid1_PageInit();
      }
 
      private void Grid1_PageInit()
      {
 
         RadGrid1.Skin = "Office2010Blue";
         this.RadGrid1.NeedDataSource += new GridNeedDataSourceEventHandler(this.RadGrid1_NeedDataSource);
 
         RadGrid1.Width = Unit.Percentage(100);
         RadGrid1.AllowPaging = true;
         RadGrid1.GroupingEnabled = false;
         RadGrid1.ShowGroupPanel = false;
         RadGrid1.ShowStatusBar = true;
         RadGrid1.AllowMultiRowSelection = true;
 
         RadGrid1.PagerStyle.Mode = GridPagerMode.NextPrevAndNumeric;
         RadGrid1.PagerStyle.AlwaysVisible = true;
 
         RadGrid1.ClientSettings.AllowDragToGroup = true;
         RadGrid1.ClientSettings.Selecting.AllowRowSelect = true;
         RadGrid1.ClientSettings.AllowColumnsReorder = true;
         RadGrid1.ClientSettings.AllowKeyboardNavigation = true;
 
         RadGrid1.ClientSettings.Scrolling.AllowScroll = true;
         RadGrid1.ClientSettings.Scrolling.UseStaticHeaders = true;
         RadGrid1.ClientSettings.Scrolling.ScrollHeight = Unit.Percentage(100);
 
         RadGrid1.ClientSettings.Resizing.AllowColumnResize = true;
         RadGrid1.ClientSettings.Resizing.EnableRealTimeResize = true;
         RadGrid1.ClientSettings.Resizing.ResizeGridOnColumnResize = true;
         RadGrid1.ClientSettings.Resizing.AllowResizeToFit = true;
 
         // Add Master Table
         RadGrid1.MasterTableView.PageSize = 20;
         RadGrid1.MasterTableView.AllowSorting = true;
         RadGrid1.AutoGenerateColumns = false;
         RadGrid1.MasterTableView.EnableColumnsViewState = false;
 
         string ddlValue = Request.Form.Get("DropDownList1");
         switch (ddlValue)
         {
            case "customers":
               goto default;
            case "orders":
               pageGrid.gridDbConnection = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
               pageGrid.gridQuery = "SELECT OrderID, OrderDate, ShipName, ShipAddress FROM Orders";
               gridColumn.Clear();
               gridColumn.Add(new myListviewColumn(0, "orderid", "Order", AttributeType.String, 100));
               gridColumn.Add(new myListviewColumn(1, "orderdate", "Orderdatum", AttributeType.String, 100));
               gridColumn.Add(new myListviewColumn(2, "shipname", "Bedrijf", AttributeType.String, 100));
               gridColumn.Add(new myListviewColumn(3, "shipaddress", "Adres", AttributeType.String, 100));
               break;
            default:
               pageGrid.gridDbConnection = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
               pageGrid.gridQuery = "SELECT CompanyName, ContactName, Address, City FROM Customers";
               gridColumn.Clear();
               gridColumn.Add(new myListviewColumn(0, "companyname", "Bedrijf", AttributeType.String, 200));
               gridColumn.Add(new myListviewColumn(1, "contactname", "Contactpersoon", AttributeType.String, 200));
               gridColumn.Add(new myListviewColumn(2, "address", "Adres", AttributeType.String, 200));
               gridColumn.Add(new myListviewColumn(3, "city", "Plaats", AttributeType.String, 200));
               break;
         }
 
         CreateListlayout();
 
      }
 
      private void CreateListlayout()
      {
 
         GridClientSelectColumn selectColumn;
         selectColumn = new GridClientSelectColumn();
         selectColumn.UniqueName = "ClientSelectColumn";
         selectColumn.HeaderStyle.Width = Unit.Pixel(35);
         selectColumn.Resizable = false;
         RadGrid1.MasterTableView.Columns.Add(selectColumn);
 
         GridBoundColumn boundColumn;
         for (int i = 0; i < gridColumn.Count; i++)
         {
            boundColumn = new GridBoundColumn();
            boundColumn.DataField = gridColumn[i].AttributeName;
            boundColumn.HeaderText = gridColumn[i].Name;
            boundColumn.ItemStyle.Wrap = false;
            if (i < gridColumn.Count - 1) { boundColumn.HeaderStyle.Width = Unit.Pixel(gridColumn[i].Width); }
            RadGrid1.MasterTableView.Columns.Add(boundColumn);
         }
 
      }
 
      protected void RadGrid1_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
      {
         SqlDataReader dr;
         dr = SqlRetrieve(pageGrid.gridQuery, pageGrid.gridDbConnection);
         RadGrid1.DataSource = dr;
      }
 
      protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
      {
         RadGrid1.CurrentPageIndex = 0;
         RadGrid1.MasterTableView.SortExpressions.Clear();
         RadGrid1.Rebind();
      }
 
 
      // Retrieve data using a SQL Query
      public static SqlDataReader SqlRetrieve(string sql, string connectionString)
      {
 
         // Create the database connection
         SqlConnection dbConnection = new SqlConnection(connectionString);
 
         // Prepare the SQL command execution
         SqlCommand cmd = new SqlCommand(sql, dbConnection);
         cmd.CommandType = CommandType.Text;
 
 
         // Retrieve data with sqlDataReader
         try
         {
            dbConnection.Open();
            // Make sure the database connection is closed when the datareader is closed.
            return cmd.ExecuteReader(CommandBehavior.CloseConnection);
         }
         catch (SqlException dbex)
         {
            return null;
         }
         catch (Exception ex)
         {
            return null;
         }
 
      }
 
      public class myListview
      {
         public string gridQuery { get; set; }
         public string gridDbConnection { get; set; }
      }
 
      public class myListviewColumn
      {
         public int Index { get; set; }
         public string Name { get; set; }
         public string AttributeName { get; set; }
         public int Type { get; set; }
         public int Width { get; set; }
 
         public myListviewColumn(int index, string attributename, string name, int type, int width)
         {
            Index = index;
            Name = name;
            Type = type;
            Width = width;
            AttributeName = attributename;
         }
 
      }
 
   }
}

Kind Regards, Remco

7 Answers, 1 is accepted

Sort by
0
Remco
Top achievements
Rank 1
answered on 05 Dec 2011, 06:55 PM
[update]

I was able to solve the second issue using ClientEvents and a hidden field.

However I'm still unable to solve the error, when a user changes a column width or moves a grid column to a new column position and immediately after that selects a different view. If the user moves to a new page first and then selects a new view all works well.

Hope someone can point me in the right direction...
 
0
Adam
Top achievements
Rank 1
answered on 05 Dec 2011, 10:59 PM
I too just came searching today for a solution to this exact same problem.  I am using NeedDataSource with a drop down for the basic parameter that drives not only the grid structure but data as well.
0
Andrey
Telerik team
answered on 06 Dec 2011, 11:32 AM
Hi Adam,

Try setting the DataSource property to null before calling the Rebind() method for your RadGrid and check whether this resolves the issue.

Your code should be something similar to this:

protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
    RadGrid1.CurrentPageIndex = 0;
    RadGrid1.MasterTableView.SortExpressions.Clear();
    RadGrid1.DataSource = null;
    RadGrid1.Rebind();
}

Regards,
Andrey
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
Remco
Top achievements
Rank 1
answered on 06 Dec 2011, 11:47 AM
Hello Andrey,

Thanks, but this does not solve the problem. I tried that before and tried it again, following your suggestion. However I still get the same error message, see attached screenshot, if I switch to another view immediately after resizing a column or a column swap. 

Any other suggestions?

Regards, Remco
0
Andrey
Telerik team
answered on 06 Dec 2011, 02:17 PM
Hi Remco,

Another approach you could try is to create the whole structure of RadGrid in code behind in the Grid1_PageInit() method and to remove its tag from the mark-up code. Splitting the structure in both places sometimes could mess up the ViewState.

Your code should be something similar to this:

private void Grid1_PageInit()
      {
  
         RadGrid RadGrid1 = new RadGrid();
         RadGrid1.ID = "RadGrid1";
         RadGrid1.Skin = "Office2010Blue";
         this.RadGrid1.NeedDataSource += new GridNeedDataSourceEventHandler(this.RadGrid1_NeedDataSource);
  
         RadGrid1.Width = Unit.Percentage(100);
         RadGrid1.AllowPaging = true;
         RadGrid1.GroupingEnabled = false;
         RadGrid1.ShowGroupPanel = false;
         RadGrid1.ShowStatusBar = true;
         RadGrid1.AllowMultiRowSelection = true;
         .......................................

Give these suggestion a try and if the issue still persists please share a sample project that  we could test debug locally.

Regards,
Andrey
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
Remco
Top achievements
Rank 1
answered on 06 Dec 2011, 07:14 PM
Hi Andrey,

I already tried this approach before, but it  does not solve the issue. I'll create a support ticket and upload my sample solution with it. 

Regards, Remco
0
Remco
Top achievements
Rank 1
answered on 07 Dec 2011, 05:25 PM

For anyone interested in the solution provided by Telerik for this issue, I post their response.

This is a scenario that RadGrid does not support with ViewState on - to apply changes to columns of RadGrid which will not be available on subsequent postbacks. The problem is that the control tries to recreate the resizing and reordering changes (this is not part of the columns viewstate but of the whole control) but does not manage to find the columns to which they should be applied. So, you have two options:

1) To drop the resizing and reordering features from this grid.
2) To disable the ViewState of the whole placeholder where you load the RadGrid control. In this scenario have in mind that the SqlDataReader binding may not works, as each postback in the page will make the grid try to rebind and if the reader is currently closed, you will get an exception.

Additionally, just an advice - place this line, after all the logic that adds controls to the grid (to make sure that all properties are applied correctly):
this.PlaceHolderGrid1.Controls.Add(RadGrid1);

I hope this helps.


Tags
Grid
Asked by
Remco
Top achievements
Rank 1
Answers by
Remco
Top achievements
Rank 1
Adam
Top achievements
Rank 1
Andrey
Telerik team
Share this question
or