This is a migrated thread and some comments may be shown as answers.

Grid - set Route Value for current row (for a detail page)

2 Answers 427 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Paul
Top achievements
Rank 1
Paul asked on 13 Nov 2019, 10:03 AM

Hi,
I'm new to Telerik, and there's a lot about MVC that I'm still learning, so apologies in advance.
I have a Grid Control that I'm passing an object to (see code below).  I want a detail page which is a little complex and beyond the scope of what a popup would handle, so a separate page is necessary.

I'm really struggling to get a "Select" button working to send route value out, something like /Person/Details/5
The grid itself is working as expected, however I can't seem to invoke a route or action based on the current selected row or invoke an action on the select button.
 
I've written a comment in the actual section I'm having a problem with. 
 
Thanks

@(Html.Kendo().Grid(Model)
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.person.Title).Width(100);
            columns.Bound(p => p.person.Firstname);
            columns.Bound(p => p.person.Firstname);
            columns.Bound(p => p.person.Surname);
            columns.Bound(p => p.person.ABN).Width(210);
            columns.Bound(p => p.person.PracticeCode);
            columns.Bound(p => p.currentform);
            columns.Command(command => { command.Edit();  });
            columns.Command(command => { command.Destroy();  });
            columns.Command(command => { command.Select(); });
        })
    .Sortable()
    .ToolBar(commands => commands.Create())
    .Editable(editable => editable.Mode(GridEditMode.PopUp))
    .DataSource(dataSource => dataSource
        .Server()
        .Model(model => model.Id(p => p.person.pkey))
        .Create(create => create.Action("Create", "Person"))
        // I'm having trouble with this next line.
        //  All I want is the drkey to be a route value
        // Obviously, this doesn't work because you can't put a lamba in the anonymous type, but how do you do it ?
        .Read(read => read.Action("Details", "Person", new { id = (p => p.person.pkey) } ))
        .Update(update => update.Action("Update", "Person"))
        .Destroy(destroy => destroy.Action("Destroy", "Person"))

2 Answers, 1 is accepted

Sort by
0
Paul
Top achievements
Rank 1
answered on 14 Nov 2019, 07:06 AM

I ended by solving this with a Template. 

Not exactly the outcome I was looking for, but close enough at this stage. 

columns.Bound(p => p.person.pkey).Template(@<text>
            @Html.ActionLink("Details" , "Details" , new { id = @item.person.pkey })
            </text>);

 

The trick is that a traditional MVC razor action is placed inside a Telerik Template.

 

It also removed the need for the .Select and .Read rows. 

0
Tsvetomir
Telerik team
answered on 15 Nov 2019, 07:04 AM

Hi Paul,

I have investigated the provided grid declaration and I can confirm that the best approach that you could undertake is to utilize the Template functionality of the columns. In the current case, the data source of the grid is configured to "Server", therefore, the server-side is the place where you have access to the data item. 

However, if you would like to have a button and based on the current row, redirect to a view, I would recommend subscribing to the click event handler of the button. There, the target is the button, so you would have to access the parent row. Via the row, access the data item:

function(e){
     var row = $(e.target).closest("tr");
     var dataItem = $("#grid").getKendoGrid().dataItem(row);
     // redirect to your view
     // window.location = "myurl/" + dataItem.id
}

Let me know in case additional assistance is required.

 

Best regards,
Tsvetomir
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Paul
Top achievements
Rank 1
Answers by
Paul
Top achievements
Rank 1
Tsvetomir
Telerik team
Share this question
or