Kendo UI Grid binding with scaffolding/CRUD operations to model

Question

First of all, I'm a complete novice with Kendo UI/Client side code.

I'm used to using standard MVC scaffolding to display my tables (Entity first):

  +------------------------------------+
  | +--------------------------------+ |
  | |___ID___|__Name_|__price_|______| |
  | |        |       |        |CRUD  | |
  | |        |       |        |      | |
  | |        |       |        |      | |
  | |        |       |        |      | |
  | |        |       |        |      | |
  | +--------+-------+--------+------+ |
  +------------------------------------+

where the CRUD part shows:

@Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
@Html.ActionLink("Details", "Details", new { id=item.ID }) |
@Html.ActionLink("Delete", "Delete", new { id=item.ID })

In terms of the Kendo Grid, however, I'm at a loss as to incorporating their Actions with these.

I.e. How am I meant to be 'adding' their inline or (preferably) pop up editing with this?

My model is a database table:

@model IEnumerable<ProjectName.Models.TableName>

I am currently giving the table an ID and using the following script:

<script>
    $(document).ready(function () {
        $('#myTablesID').kendoGrid({
            scrollable: true,
            sortable: true,
            groupable:true,
            pageable: true,
            selectable: "row",
            filterable: true,
            resizable: true,
            dataSource: { pageSize: 10 }
        });
    });
</script>

Is there a 'standard' way of using the MVC scaffolding with pop up editing in the Kendo Grid?

Answer 1

The HTML5/Javascript source in this link is a very good place to start. http://demos.telerik.com/kendo-ui/grid/editing-popup

You have to set up matching controller actions. Refer to the Editing_PopupController.cs example in the ASP.NET MVC source section