Bind dynamic grid update to dynamic or anonymous model

[David]

Hello,

I'm wondering if it's possible to bind a grid to a dynamic or anonymous model when performing a DataSource update operation. In this case, I've got a dynamic grid that is built off a DataTable.  The grid is setup for in-cell editing and when I save the changes (i.e. perform the update), I wonder if there's a way to have it bind to an anonymous model for processing inside the Update controller method. Currently I can view the updated records as a FormCollection, but an anonymous model would make it easier for processing. Please advise whether it's possible, or if there's a better way to handle the updates.

Here's sample view code:

 

@(Html.Kendo().Grid<dynamic>()
    .Name("grdCombined")
    .ToolBar(toolBar =>
    {
        toolBar.Save();
    })
    .Columns(columns =>
    {
        foreach (System.Data.DataColumn column in Model.gridTable.Columns)
        {
            if(column.ColumnName == "UUID" || column.ColumnName.ToLower().Contains("_uuid")) { continue; }
            if(column.ColumnName == "Name") { var cn = columns.Bound(column.ColumnName).Width(200).Filterable(ftb => ftb.Multi(false).Search(true).Enabled(true)).Title(column.ColumnName); continue; }
            if(column.ColumnName.EndsWith("_Date")) { var cd = columns.Bound(column.ColumnName).Width(200).Format("{0: MM/dd/yyyy}").Title(column.ColumnName).EditorTemplateName("Date"); continue; }
            if(column.ColumnName.EndsWith("_Comment")) { var cd = columns.Bound(column.ColumnName).Width(200).Title(column.ColumnName).EditorTemplateName("String"); continue; }
            var c = columns.Bound(column.ColumnName).Width(200).Title(column.ColumnName);
        }
    })
    .Editable(ed=>ed.Mode(GridEditMode.InCell))
    .Navigatable()
    .Scrollable(s=>s.Virtual(true))
    .DataSource(ds => ds
        .Ajax()
        .Model(model =>
        {
            var m_id = Model.gridTable.PrimaryKey[0].ColumnName;
            model.Id(m_id);
            foreach (System.Data.DataColumn col in Model.gridTable.Columns)
            {
                var m_field = model.Field(col.ColumnName, col.DataType);
                if(col.ColumnName == m_id || col.ColumnName == "Name")
                {
                    m_field.Editable(false);
                }
            }
        })
        .Read(read=>read.Action("GridCombined_Read","Home", new { pUUID = Model.UUID }))
        .Update(update=>update.Action("GridCombined_Update","Home", new { pUUID = Model.UUID})))
    )

 

And here's the sample Update controller method:

public ActionResult GridCombined_Update([DataSourceRequest] DataSourceRequest request, FormCollection pGC, Guid pUUID)
{
	// TODO: process the update
	return Json(m_Service.GridCombined_Update(pGC, pUUID).ToDataSourceResult(request));
}

[Anton Mironov]

Hi David,

Thank you for the code snippets and details provided.

In order to achieve the desired behavior, I would recommend using a custom button for saving the changes. In the Click Event handler of the button, send the dataSource of the Grid via an Ajax request to an Action Method of the Controller.

Give a try to the approach above and let me know if this achieves the desired result.


Kind Regards,
Anton Mironov

[David]

Thanks, I may change to this approach.

However, I have a new problem with the above code. When enabling the Save command on the toolbar, I can trigger the datasource Update with the button and it works well. However, if I press the Cancel button, the grid changes are reverted but it's followed by an endless progress spinner and the only way to recover is to reload the page. Checking the dev tools console, I do not see any error messages.

Do you know why I'm encountering this problem, or what I can do to further debug the problem?

 

Thanks

[Patrick | Technical Support Engineer, Senior]

To better help you receive a quicker time frame on this issue(24 hour response time), I have created a support ticket on your behalf.   Please let me know if you have any questions.