Hello.
I'm developing a page with RadGrid. Grid should have ability to reorder positions of predefined columns and ability to hide some of them.
And I'm facing with very strange behavior. I prepared small example with this bug
It should display columns 1..5 after start and columns 5 and 2 after pressing a button is not it?
But what we see:
1) columns 1..5 after start, ok
2) when press a button - there are only 2 and 5 columns, but it should be 5 and 2, the order is wrong
3) press a button again - columns displayed changed (!) to 2 and 1
If we set breakpoint on grid.Rebind() line and look at grid.Columns we'll see that there is correct order (visible column5 and column2, then invisible column1, column 3, column4) every time. So I think that root of evil is in some AJAX logic or in grid rendering code. Or may be something is wrong with my code?
I'm developing a page with RadGrid. Grid should have ability to reorder positions of predefined columns and ability to hide some of them.
And I'm facing with very strange behavior. I prepared small example with this bug
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Web.Test" %><!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></title></head><body> <form id="form1" runat="server"> <div> <asp:ScriptManager runat="server" /> <telerik:RadGrid ID="grid" runat="server" AutoGenerateColumns="False"> <MasterTableView> <Columns> <telerik:GridBoundColumn DataField="column1" UniqueName="column1" /> <telerik:GridBoundColumn DataField="column2" UniqueName="column2" /> <telerik:GridBoundColumn DataField="column3" UniqueName="column3" /> <telerik:GridBoundColumn DataField="column4" UniqueName="column4" /> <telerik:GridBoundColumn DataField="column5" UniqueName="column5" /> </Columns> </MasterTableView> </telerik:RadGrid> <asp:Button ID="btnButton" runat="server" Text="Press Me" /> </div> </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 Telerik.Web.UI;namespace Web{ public partial class Test : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { grid.NeedDataSource += new Telerik.Web.UI.GridNeedDataSourceEventHandler(grid_NeedDataSource); btnButton.Click += new EventHandler(btnButton_Click); } void btnButton_Click(object sender, EventArgs e) { var columns = new string[] { "column5", "column2" }; List<GridColumn> items = grid.Columns.Cast<GridColumn>().ToList(); grid.Columns.Clear(); for (int i = 0; i < columns.Count(); i++) { // Adding visible columns
GridColumn column = items.FirstOrDefault(a => a.UniqueName == columns[i]); column.Visible = true; grid.Columns.Add(column); } for (int i = 0; i < items.Count; i++) { // Adding invisible columns
if (!columns.Contains(items[i].UniqueName)) { items[i].Visible = false; grid.Columns.Add(items[i]); } } grid.Rebind(); } void grid_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e) { grid.DataSource = Enumerable.Range(0, 5).Select(i => new { column1 = 1 * Math.Pow(10, i), column2 = 2 * Math.Pow(10, i), column3 = 3 * Math.Pow(10, i), column4 = 4 * Math.Pow(10, i), column5 = 5 * Math.Pow(10, i), }); } }}It should display columns 1..5 after start and columns 5 and 2 after pressing a button is not it?
But what we see:
1) columns 1..5 after start, ok
2) when press a button - there are only 2 and 5 columns, but it should be 5 and 2, the order is wrong
3) press a button again - columns displayed changed (!) to 2 and 1
If we set breakpoint on grid.Rebind() line and look at grid.Columns we'll see that there is correct order (visible column5 and column2, then invisible column1, column 3, column4) every time. So I think that root of evil is in some AJAX logic or in grid rendering code. Or may be something is wrong with my code?
1 Answer, 1 is accepted
0
Hi Alex,
Changing the grid structure this way on postback is not supported with RadGrid. Instead of clearing the columns collection, you can just make the odd column invisible by setting the Visible property to false. And to reorder them programatically, you can use the OrderIndex proper of the columns.
Additionally, note that you can use the grid header context menu for hiding columns. And you can allow the user to save the preferable grid settings.
For more iinformation, please refer to the below articles:
http://www.telerik.com/help/aspnet-ajax/grid-changing-structure-dynamically.html
http://www.telerik.com/help/aspnet-ajax/grid-reordering-columns.html
http://demos.telerik.com/aspnet-ajax/grid/examples/generalfeatures/headercontextmenu/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/grid/examples/programming/savinggridsettingsonperuserbasis/defaultcs.aspx
Iana Tsolova
the Telerik team
Changing the grid structure this way on postback is not supported with RadGrid. Instead of clearing the columns collection, you can just make the odd column invisible by setting the Visible property to false. And to reorder them programatically, you can use the OrderIndex proper of the columns.
Additionally, note that you can use the grid header context menu for hiding columns. And you can allow the user to save the preferable grid settings.
For more iinformation, please refer to the below articles:
http://www.telerik.com/help/aspnet-ajax/grid-changing-structure-dynamically.html
http://www.telerik.com/help/aspnet-ajax/grid-reordering-columns.html
http://demos.telerik.com/aspnet-ajax/grid/examples/generalfeatures/headercontextmenu/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/grid/examples/programming/savinggridsettingsonperuserbasis/defaultcs.aspx
Iana Tsolova
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