Connecting Grid to Collection in Model

[James]

I have a Grid that I want to use for adding information to a collection in the DataModel of my view.  How do I bind the Grid to my collection and then when it is passed back to the controller ensure that any CRUD changes made to grid are reflected in the DataModel?  Below is my Grid. 

01.@(Html.Kendo().Grid(Model.Charges)
02.      .Name("charges_grid")
03.      .Columns(columns =>
04.      {
05.          columns.Bound(charge => charge.Type)
06.              .Title("Charge Description");
07.          columns.Bound(charge => charge.Amount)
08.              .HtmlAttributes(new { @style = "text-align:right;" })
09.              .Width(100)
10.              .Title("Amount");
11.          columns.Command(command =>
12.          {
13.              command.Edit();
14.              command.Destroy();
15.          }).Width(175);
16.      })
17.      .BindTo(Model.Charges)
18.      .ToolBar(toolbar => toolbar.Create())
19.      .Editable(editable => editable.CreateAt(GridInsertRowPosition.Bottom))
20.      .DataSource(dataSource => dataSource
21.          .Ajax()
22.          .Model(model => model.Id(p => p.Type))
23.          .ServerOperation(false)
24.          .Create(update => update.Action("Create", "Home"))
25.          .Read(read => read.Action("Read", "Home"))
26.          .Update(update => update.Action("Update", "Home"))
27.          .Destroy(update => update.Action("Destroy", "Home"))
28.      ))

This is part of a larger view where I am capturing the data for my model, but I can not get my grid to populate with contents of my collection on load or my model to contain updated or new items upon return to the controller.  Below is a sample of my model.

01.public class Shipment
02.{
03.   // other data members
04.    public string Signed { get; set; }
05.    public string BundleId { get; set; }
06.    public float TotalAmountDue { get; set; }
07.
08.    public ICollection<Charge> Charges { get; set; }
09.}

[Petur Subev]

Hello James,

The Grid widget is not a form element and it cannot be simply submtted to the server. The Grid uses its own transport that uses Ajax to send the changes to the server via a specific Action method. How to implement editing is covered in our documentation here:

http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/ajax-editing

On a side note if you want to send the Grid changes to the server via a form it is possible through a work-around (using hidden input elements inside the templates) that has several limitations. You can give a try and use it if you find it appropriate:

http://www.telerik.com/support/code-library/submit-form-containing-grid-along-with-other-input-elements

Kind Regards,
Petur Subev
Telerik