MVC Kendo UI Grid = Custom Button can't return

Question

I want to get the selected row "ID" but it just failed... and i have totally no clue what is happening here. MVC HTML Code :

@(Html.Kendo().Grid(Model)
    .Name("grid")
    .HtmlAttributes(new { style = "margin-top: 5px" })
    .Columns(c =>
    {
        c.Bound(model => model.mgID);
        c.Command(com => { com.Custom("Edit").Click("Edit");});
    })
    .Pageable()
    .Sortable()
    .Selectable()
    .DataSource(d => d
        .Ajax()
        .PageSize(20)
        .Model(model => model.Id(i => i.mgID))
        .Read(r => r.Action("Manage_Read", "Manage"))
        .Destroy(o => o.Action("Manage_Destroy", "Manage"))
    )
)

Javascript Code :

    function Edit() {

        var grid = $("#grid").data("kendoGrid");
        var row = grid.select();
        var selectedRowIndex = row.index();   //Return "-1"
        var dataItem = grid.dataItem(row);    //Return "Undefined"

    }

Please tell me, what am i miss out??

Answer 1

If all you need is get the dataItem of the row containing the clicked "Edit" button, you can use:

function Edit(e) {
    var dataItem = this.dataItem($(e.target).closest("tr"));
}

NOTE:

• in the context of click event this is the grid.
• in that same context e.target is your button, so we look for the closest table row.