01 November 2015

Dynamically generate header in SilverLight Telerik RAD Grid using MVVM approach

In this post, we will discuss how to dynamically change the grid headers in SilverLight Telerik RAD Grid using MVVM approach.

Create simple Silverlight project ‘DynamicGridHeader’. Create two folders name it as “View” and “View Model”. Add Silverlight user control to the View folder name it as “MyView”. MyView page will have all my user controls to show the data.

Create simple Telerik grid in the page and add one button to change the headers.  Grid should have Four columns showing data for country Names, Country ID, Population for current year and last year population.















Create a class in view model to add data to the grid.  And implement INotifyPropertyChanged
Interface to get notification when property changes.














Populate dummy data in the constructor.


























Till now the grid will show the data for current year and previous year. With column headers as 2012 and 2011.














Now when user want to check data for 2011 and 2010 the column header will not change. It is always show 2012 and 1011. To change the column dynamicaly create two properties one showing selected year and other showing previous year. Bind these properties to textblock and then to the grid headers.









Now when user select previous year the headers will changed dynamically.





















That's it. Simple and elegant solution !


No comments: