Server Template in Auto Generated Columns

[James]

Hi, 

I've been working on this issue for a few days now but have not been able to find a solution. I am supplying the grid with a data table that is created elsewhere. Effectively the user is creating a table with custom columns, thus I cannot create a model and with the columns specified. The column names and data types are deferred from the data table at runtime and the columns are auto generated. However within the data table there are always two fields: 'Rank' and 'RankId'.

Rank is a string value
RankId is a numerical listing the position of rank.

I would like to display the 'Rank' value but use the 'RankId' numerical value for sorting etc. This is not a huge issue as I can use client templates to use the 'Rank' column instead of the 'RankId'. However client templates are of course only applied when an ajax call  is made. Here's the view code

Html.Telerik().Grid(Model.DataTable)
        .Name("RegisterTable")
        .DataBinding( bind => bind.Ajax().Select("_ViewAjaxBinding", "Registers", new { registerId = Model.RegisterId}))
        .Columns(columns =>
        {
            columns.AutoGenerate(column =>
                     {
                         if (column.Member == "RankId")
                         {
                             ---HERE'S WHERE I'D LIKE TO PUT THE SERVER TEMPLATE
                             column.Title = "Rank";
                             column.ClientTemplate = "<#= Rank#>";
                         }
                         if( column.Member == "Rank" ){
                            column.Visible = false;
                         }
                     });
        })
        .Render();

One solution is to create the server template - and I've tried but can't seemed to get it to work. On thing I did try was

column.template = ( t => t.Row["Rank"].ToString() )

;
but couldn't get this or any variation to work.

Another solution would be to not load the data on the page load, and have an ajax call when the page loads (thus applying the client side templating) - while I know this is possible by not supplying data to the grid, you still have to supply some kind of model (in order for the columns to be deferred), the problem is I can't do this as the data table is generated on the fly.

Any help would be greatly appreciated.

Thanks,

[Michael Maluck]

Hi James,

short time ago I did a migration from server binding to ajax binding and had some issues, too. On initial load my model was directly used and client templates were ignored. Any further action, i.e. paging, pulled data the ajax way and fired OnDataBinding. Looking at the Client-side Events sample from telerik I did see a different behavior. After some investigation I did find the problem: You must not provide your model as constructor parameter when initializing the grid. Instead specify your record type for the generic constructor and remove your model parameter. Now the first load will be ajaxified, too.

Change this:
Html.Telerik().Grid(Model.DataTable)

to:
Html.Telerik().Grid< your record type >()

Please, Telerik, add a big hint for this in your ajax samples/documentation as I needed some time, too, to figure it out. In my opinion this is an easy mistake when migrating from server binding to ajax binding.

HTH,
Michael

[James]

Hi Michael, 

Thanks for getting back to me. I see where you're going with this, unfortuntately the issue is that I can't provide the record type as the data table is created on the fly depending on what columns the user has chosen. Thus I must code

Html.Telerik().Grid(Model.DataTable)

in order for the grid to deffer the columns from it.

In essence I'm working with a loosely typed data table. One route that would be really useful, it to defer the columns from the data table, not load any data, then on page call ajax to get the data (effective perform an table refresh on load). But this seems a pretty ugly way of doing things. 

The only other way I can think of generating the record type on the fly (effectively creating a temp class at runtime)?

Let me know if you have any ideas,

Thanks,

[Michael Maluck]

Hi James,

now I assume you do not want to change the table structure during your Ajax call. The autogeneration of columns seams to work differently if you pass the model to the GridBuilder. In my previous post I put it wrong, this Html.Telerik().Grid is of course not a constructor but a GridBuilder. Maybe it helps you not to use the built-in AutoGenerate.

Pass your Columns as part of your model:
public class MyCustomModel
{
    public DataColumnCollection Columns { get; set; }
}

In the normal controller action (i.e. Index()) you set this to DataTable.Columns.

You can construct the grid like this:
    Html.Telerik().Grid<System.Data.DataRow>()
        .Name("Grid")
        .Columns(columns =>
        {
            foreach(System.Data.DataColumn dataColumn in Model.Columns)
            {
                columns.Bound(dataColumn.DataType, dataColumn.ColumnName)
                    .ClientTemplate("Data: <#= " + dataColumn.ColumnName + "#>");
            }
        })
        .DataBinding(dataBinding => dataBinding.Ajax().Select("_AjaxBinding", "Grid"))

In the GridAction decorated controller action you return the DataTable.

HTH,
Michael

[Kamlesh]

Hi,

I copy the code as it is mentioned but the grid shows columns name only not the data. My code is mentioned below:-

@(Html.Telerik().Grid<System.Data.

 

DataRow>() .Name("Region")
.DataKeys(dataKeys => dataKeys.Add("region"))

.Columns(columns =>{ 

columns.Command(commands => commands.Select()).Title(

 

"Select");
foreach (System.Data.DataColumn dataColumn in dt.Columns)

 

{
columns.Bound(dataColumn.DataType, dataColumn.ColumnName)
.ClientTemplate(

"Data: <#= " + dataColumn.ColumnName + "#>");

}}).Selectable()

Even, I attached the screen shot for the page which display column name only, not the data. Plz help me on issue.

thanks,

Regards,

Kamlesh Chettiyar