Issues with Delete/Update Operations in an ASP.NET MVC Kendo UI Grid

Question

For a special grid, i need to give the user the possibility to update and delete rows.

My code is basically the same as here : http://demos.telerik.com/aspnet-mvc/grid/editing-popup But the update and delete operations don't work.No exceptions are launched but the rows are still the same when i refresh the grid:

here is my code:

@using Kendo.Mvc.UI
@model DevelopmentNotesProject.Models.NoteJoinLanguage

@{
    ViewBag.Title = "Index";
}


<script type="text/javascript">
    function formatter(value) {
        return value.substring(0, 50);
    }
</script>


<section id="listing">
    <h2>My Notes</h2>

        @(Html.Kendo().Grid<DevelopmentNotesProject.Models.NoteJoinLanguage>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(c => c.Title).Width(400).ClientTemplate(string.Format("{0}...", "#= formatter(Title) #"));
            columns.Bound(c => c.Text).Width(400).ClientTemplate(string.Format("{0}...", "#= formatter(Text) #"));
            columns.Bound(c => c.lang).Title("Language");
            columns.Command(command => { command.Edit(); command.Destroy(); }).Width(160);
        })
        .HtmlAttributes(new { style = "height: 380px;" })
        .Scrollable()
        .Groupable()
        .Sortable()
        .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
         .DataSource(dataSource => dataSource // Configure the grid data source
                  .Ajax() // Specify that ajax binding is used
                  .Read(read => read.Action("Notes_Read", "MyNotes")) // Set the action method which will return the data in JSON format
                  .Destroy(update => update.Action("Notes_Destroy", "MyNotes"))
                  .Update(update => update.Action("Notes_Update", "MyNotes"))
                  .Model(model => model.Id(p => p.id))
               )
         .Selectable()
        )



  </section>

@Html.ActionLink("Add a new note", "Add", "MyNotes")

 @section Scripts {
        @Scripts.Render("~/bundles/jqueryval")
    }

And finally my controller:

   public ActionResult Notes_Read([DataSourceRequest]DataSourceRequest request)
        {
            var dbo = new UsersContext();
            var notes = (from a in dbo.Note
                         join b in dbo.Language on a.languageId equals b.id
                         where a.userId == WebSecurity.CurrentUserId
                         select new { a.id, a.Text, a.Title, b.lang }).ToList();

            DataSourceResult result = notes.ToDataSourceResult(request);
            return Json(result);
        }

        [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult Notes_Destroy([DataSourceRequest]DataSourceRequest request, NoteForm note)
        {
            var dbo = new UsersContext();
            var results = (from row in dbo.Note
                          where row.id == note.id
                          select row).ToList();

            foreach (var item in results)
            {
                dbo.Note.Remove(item);
            }
            return Json(new[] { note }.ToDataSourceResult(request, ModelState));
        }

        [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult Notes_Update([DataSourceRequest]DataSourceRequest request, NoteForm note)
        {
            var dbo = new UsersContext();
            NoteForm nf = (from row in dbo.Note
                          where row.id == note.id
                          select row).First();

            nf.languageId = note.languageId;
            nf.Text = note.Text;
            nf.Title = note.Title;
            dbo.SaveChanges();
            return Json(new[] { note }.ToDataSourceResult(request, ModelState));

        }

Thanks in advance for your help PS: the Notes_read method works well!

Answer 1

At Update Action you have to return the new note (nf) not the old one (note).

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Notes_Update([DataSourceRequest]DataSourceRequest request, NoteForm note)
{
    var dbo = new UsersContext();
    NoteForm nf = (from row in dbo.Note
                  where row.id == note.id
                  select row).First();

    nf.languageId = note.languageId;
    nf.Text = note.Text;
    nf.Title = note.Title;
    dbo.SaveChanges();
    return Json(new[] { nf }.ToDataSourceResult(request, ModelState));
}

At Destroy Action you have to call dbo.SaveChanges() after deleting items.

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Notes_Destroy([DataSourceRequest]DataSourceRequest request, NoteForm note)
{
    var dbo = new UsersContext();
    var results = (from row in dbo.Note
                  where row.id == note.id
                  select row).ToList();

    foreach (var item in results)
    {
        dbo.Note.Remove(item);
    }
    dbo.SaveChanges();

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