[Solved] Accessing DataKeys from javascript

[Sushruth]

Hello, 

i am using MVC grid  to bind to a datatable  in the serverside and then have setup ajax binding for sorting/grouping etc.
Now when a row is selected i need to get the asscoicated datakey with the row in  rowselected event . How would i do that ?

I tried adding a hidden column to store the keys, but on subsequent ajax requests( i.e when sorting  ) the key column automatically become visible. 

A  solution to fix either one of the problem would save  me a lot of time ..

 thanks
sush

[Atanas Korchev]

Hello Sushruth,

Hidden columns should appear last because of a IE rendering bug.

 If you don't want to use hidden columns you can use the dataItem JavaScript method:

function onSelect(e) {
 var grid = $(this).data("tGrid");

 var dataItem = grid.dataItem($(e.row));

 var key = dataItem.MyDataKeyProperty;
}

Regards,
Atanas Korchev
the Telerik team

[Sushruth]

I get the following error message in the chrome
TypeError: Cannot read property '1' of undefined


In fire Bug:

this.data is undefined

When i execute the   var dataItem = grid.dataItem($(e.row));
Look like the datakey does not get sent to the client for some reason.

here is  my serverside code

// 'dt' is of datatable type

 @(Html.Telerik().Grid(dt)
.Name(gridName)
.Columns(columns =>
  {
   columns.LoadSettings(visualizerConfiguration.Columns); 
  })
  .DataKeys(keys => keys.Add(visualizerConfiguration.Columns[0].Member))
  .RowAction(row =>
  {
   if (row.Index == 0)
   {
    row.Selected = true;
   }
  })
   .DataBinding(bind => bind.Ajax().Select("_GridAjaxSelection", "GenericVisualizer", new { gridId = gridName, key=nodeId}))
.Scrollable(scrolling => scrolling.Enabled(true))
.Selectable()
.Filterable()
.Sortable()
.Groupable()
.Reorderable(t => t.Columns(true))
.Resizable(t => t.Columns(true))
.Footer(true)
.Pageable(pa => pa.PageSize(1000).Enabled(true))
.ClientEvents(events => events.OnRowSelect(gridRowSelectFunction)))

do you see anything wrong with it ?

[Sushruth]

Created a sample to project replicate the issue.
Click on any row it executes the js.

[Atanas Korchev]

Hello Sushruth,

 This occurs because the dataItem grid works only for ajax bound grids. Your grid is initially bound server side.

Also you seem to have taken my example literally. Your model does not contain a property named MyDataKeyProperty. Of course you should use a property from your mode which exists e.g. "Path".

I have fixed your project and you can find it attached.

Regards,
Atanas Korchev
the Telerik team

[Sushruth]

Thanks Atanas,

I also saw that the Filter fucntionality seems to have lost when we bind to datatable . is there anyway we could achieve that.?

-Sush

[Rosen]

Hello Sushruth,

Please set the data types for columns and see if this helps:

columns.Bound(typeof(int), "Path");
columns.Bound(typeof(string), "ObjectClass");

Regards,
Rosen
the Telerik team

[Sushruth]

In my application i am loading the columsettings using GridColumFactory::LoadSetting method

 
i.e   @(Html.Telerik().Grid(dataTable)    
 .Name(gridName)     
.Columns(columns =>         
    {             columns.LoadSettings(visualizerConfiguration.Columns);       
       })

So there isnt a property to specify the "type" of the column in GridColumnSettings Class,
So how could we get the filter option working properly in this case ?

[Rosen]

Hi Sushruth,

 I'm afraid that currently setting the memberType through ColumnSettings is not supported. However, we have managed to add such functionality and I'm attaching an internal build which contains it.

Regards,
Rosen
the Telerik team