The great variety of server and client-side feature of RadGrid for ASP.NET AJAX has been extended with a few more highly requested features by our customers. We are proud to announce that as of Q2 2013 RadGrid has been further improved with a forth hierarchy load mode, even more client-side features supported together with MultiColumn headers and a neat and handy GridAutoCompleteColumn providing additional options to tailor the grid and fulfill the most demanding requirements.

New Hierarchy load mode

The first of the new features that we added for this release is an option to specify a new Conditional load more for the hierarchy in RadGrid. Currently the grid has three load modes: Server, ServerOnDemand and Client. With Server load mode all child table views are initially databound when the parent table view databinds respectively. ServerOnDemand load mode only binds the child table views when they are expanded on the server and the Client load mode initially binds all table views but subsequent expand / collapse operation happen only on the client. The new Conditional load mode is combination of ServerOnDemand and Client load modes behavior. It works in the following way: when you initially try to expand and item that has never been expanded before, the grid performs a postback and databinds the respective child table view. Subsequent expand / collapse operations happen only exclusively on the client-side without the need to postback again to the server. This improves performance and provides better scalability for large number of records. This state is of course preserved in the ViewState of the control so any operation that recreates the structure of the grid on postback will reset this behavior to its initial state and a postback will be required again when initially expanding an item.
You can set the new load mode from the MasterTableView’s HierarchyLoadMode property:

More information of the new load mode can be found in the following online demo and help topic.
Let us know what you think of the new feature and whether it will improve the overall responsiveness and performance of your applications.

MultiColumn Headers show / hide support

Yet another great improvement in the RadGrid is related to the MultiColumn headers feature of the control. This has been a big hit since its initial release and now the multicolumn headers got extended support for almost all operations and actions that a user can perform on the client-side. By adding support for client-side show / hide operations and header context menu in the grid, the MultiColumn headers provide even more options for user interactions with control. 
Simply enable the header context menu of the grid with options to show and hide the columns and the MultiColumn headers cells will gracefully scale to accommodate the showing or hiding of the columns in the control.

Feel free to give this feature a try in the following online demo.

New GridAutoCompelete column in RadGrid

One more feature in release is the GridAutoCompleteColumn of RadGrid. It is based on our RadAutoCompleteBox control, which helps users with entering their values by providing list of preset data. The column also uses this control for its filter editor, for making the filtering even more convenient.
The GridAutoCompleteColumn uses the provided DataSource to populate all values in a dropdown  that are shown when the user starts typing, it has all the settings that are already available in the RadAutoCompleteBox.
To illustrate the usage of this new column I will be using a sample grid that contains two columns declared as:


As shown in the markup above, the GridAutoCompleteColumn has some additional properties compared to the GridBoundColumn:
DataTextField and DataValue  – describe which fields to be used from DataSource provided for the column. Also it has Filter property that changes the way that RadAutoCompleteBox is filtering the values in its dropdown. You can see the full list of properties in our documentation.
I have used 2 different data sources in this example. One of them has list with companies and the continents where they have offices. And the second one has the continents, to help users enter them.

<asp:ObjectDataSource ID="CompanyDatasource" runat="server" TypeName="MyDataProvider" SelectMethod="SelectCompanies" UpdateMethod="UpdateCompany" InsertMethod="InsertCompany"></asp:ObjectDataSource>
<asp:XmlDataSource runat="server" ID="XmlDataSource1" DataFile="autocomplete.xml"></asp:XmlDataSource>

The first one simply returns list of Company objects, the class is defined like:

public class Company
   public string CompanyName { get; set; }
   public string Continents { get; set; }
   public int ID { get; private set; }

And the second DataSource uses an autocomplete.xml  like:

<?xml version="1.0" encoding="utf-8" ?>
  <Item Name="Asia" Value="1" />
  <Item Name="Africa" Value="2" />
. . . .

And here is the result in Edit mode, the RadAutoCompleteBox in the edit form is bound to the second data source. During Insert/Update, the Text of the AutoCompleteBox is used for updating the RadGrid’s DataSource depending on the DataField that is set for the column.

In the filter item, the RadAutoCompleteBox used in the column has the same behavior as in the Edit Mode, so you can choose value to filter by.

And here is the filtering result:

We appreciate your feedback so do not hesitate to drop us a line in the comments below and share your impressions of the new features and how they can speed up your development.


About the Author

Marin Georgiev

is a software developer in one of Telerik's ASP.NET AJAX Teams. Since he joined the company in 2010 he's been working on different client-side features and extending the mobile support of the controls. His interests include mobile and web development as well as integration with Sharepoint 2010.

Related Posts


Comments are disabled in preview mode.