Kendo UI Grid Batch Edit After Saving Changes – Microsoft JScript runtime error: Expected ';'-Collection of common programming errors

I am using Kendo UI ASP.Net MVC – Grid – Batch Edit,

Upon clicking ‘Save’. Data gets saved in database successfully.

But “kendo.web.min.js” is throwing error “Microsoft JScript runtime error: Expected ‘;'”

@model IEnumerable
@using Kendo.Mvc.UI;


@(Html.Kendo().Grid(Model)
    .Name("Grid")
    .Columns(columns =>
    {
    columns.Bound(p => p.ID).Visible(false);
    columns.Bound(p => p.ControllerName);
    columns.Bound(p => p.ActionName);
    columns.Bound(p => p.HasAccess);
    columns.Bound(p => p.UserAccessID).Visible(false);
    columns.Bound(p => p.ControllerID).Visible(false);
    columns.Bound(p => p.ActionID).Visible(false);
    })    
    .Filterable()
    .Groupable()
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .ToolBar(toolBar => { toolBar.Save(); })
    .DataSource(dataSource => dataSource
    .Ajax()
    .Batch(true)
    .Events(events => events.Error("error"))            
    .Update(update => update.Action("Edit","ControllerActions"))
    .ServerOperation(false)
    .Model(x =>
    {
    x.Id(p => p.ID);
    x.Field(p => p.ControllerName).Editable(false);
    x.Field(p => p.ActionName).Editable(false);
    x.Field(p => p.HasAccess).Editable(true);
    })
    )
)


[HttpPost]
public ActionResult Edit([DataSourceRequest] DataSourceRequest request, [Bind(Prefix = "models")] IEnumerable controllerActionViewModel)
{
            try
            {
                if (controllerActionViewModel != null && ModelState.IsValid)
                {
                    foreach (var item in controllerActionViewModel)


 {
                db.Database.ExecuteSqlCommand("SaveUserAccess @UserID,@ControllerID,@ActionID,@UserAccessID,@HasAccess",
                               new SqlParameter("UserID", item.UserID),
                               new SqlParameter("ControllerID", item.ControllerID),
                               new SqlParameter("ActionID", item.ActionID),
                               new SqlParameter("UserAccessID", item.UserAccessID),
                               new SqlParameter("HasAccess", item.HasAccess)
                               );
            }

        }
    }
    catch (Exception ex)
    {
        Helper.SaveError(ex.InnerException.InnerException.Message, "ControllerActions", "Edit");
        ModelState.AddModelError(string.Empty, ex.InnerException.InnerException.Message);
    }

    return Json(new[] { controllerActionViewModel }.ToDataSourceResult(request, ModelState), JsonRequestBehavior.AllowGet);
}
  1. I think I may have discovered the answer to this problem, having wrestled with it for a good part of today.

    My code looked very similar to yours. The return value of my action method looked like this:

    return Json(new[] { viewmodel }.ToDataSourceResult(request, ModelState));
    

    This gave me the exact javascript error you describe. After trying many things, I eventually compared the code to another method that was working fine and so I adjusted it slightly to this:

    return Json(viewmodel.ToDataSourceResult(request, ModelState));
    

    This is now working and my MVC application is no longer throwing the javascript error.

    I hope this helps you @Jignesh.