Row Selected Event?
1 Answer 1374 Views
Bob
Top achievements
Rank 1
Bob asked on 18 Nov 2012, 05:14 PM
I'm feeling pretty stupid.

I have a page that contains a Kendo()Window

The window contains a Kendo().Grid(model)

I have populated the Grid with the data I want and have even made it selectable
@model IEnumerable<HCS.Model.FinancialInstitution>
 
@(Html.Kendo().Grid(Model)
                .Name("Grid")
                .Columns(columns =>
                {
                    columns.Bound(p => p.ID).Visible(false);
                    columns.Bound(p => p.MainRT).Groupable(false);
                    columns.Bound(p => p.LegalName);
                })
                .Sortable()
                .Scrollable()
                .Filterable()
                .Selectable()
                .DataSource(dataSource => dataSource
                            .Ajax()
                            .ServerOperation(false))
                             
)
Now I want to be able to load and populate a page based on the row selected.
Basically I want to return the 'ID' column and have the controller populate the view based on the 'ID'

BUT I AM LOST...

Can somebody please help

1 Answer, 1 is accepted

Sort by
0
Atanu
Top achievements
Rank 1
answered on 19 Nov 2012, 10:10 AM
Hi

You can configure your grid a bit different way like this:

@(Html.Kendo().Grid(Model)
                .Name("Grid")
                .Events(events => events.Change("Grid_OnRowSelect"))
                .Columns(columns =>
                {
                    columns.Bound(p => p.MainRT).Groupable(false);
                    columns.Bound(p => p.LegalName);
                })
                .Sortable()
                .Scrollable()
                .Filterable()
                .Selectable()
                .DataSource(dataSource => dataSource
                            .Ajax()
                            .ServerOperation(false)
                                .Model(model =>{model.Id(p => p.ID);})
Now in the Grid_OnRowSelect event of javascript you can get the id as below:
Grid_OnRowSelect = function (e)
{
    var data = this.dataItem(this.select());
    YourRowID = data.id;//IMP
}
The YourRowID is your ID column value which you can pass to your controller-action method by $.ajax call or as required by you.

Hope that helps
That looks very helpful. I'll give it a try.

You also brought up my next question. What is the best way to pass the value to the controller?

I know I could do something like
Grid_OnRowSelect = function (e)
{
    var data = this.dataItem(this.select());
    YourRowID = data.id;//IMP
 
    window.location("ViewName/YourRowID");
}
But I also know that that is So... NOT the way to do it.

I've read about the $.ajax call, so I'll look there
- by
Bob
Top achievements
Rank 1
on 19 Nov 2012, 01:28 PM
$.ajax call is a good option if you are passing the value to your controller action from javascript.
- by
Atanu
Top achievements
Rank 1
on 21 Nov 2012, 02:56 AM
Tags
Grid
Asked by
Bob
Top achievements
Rank 1
Answers by
Atanu
Top achievements
Rank 1
Share this question
or