This is a migrated thread and some comments may be shown as answers.

Inline Editing in Grid Model is Null When in Window

3 Answers 444 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Scott
Top achievements
Rank 1
Scott asked on 28 Jun 2013, 02:55 AM
I have a grid that display details of some items.  The grid has a custom command to open a window to display sub details of the selected item.  The grid that is displayed in the window that opens has inline editing turned on.  When I try to perform an update / create / delete, the Action is properly called, but the passed in model is null.
@(Html.Kendo().Grid<Carrier>()
      .Name("grid")
      .Columns(columns =>
          {
              columns.Bound(p => p.Name).Groupable(false).Width(125);
              columns.Bound(p => p.AuthorityReceived)
                     .Title("A")
                     .Filterable(false)
                     .Width(40)
                     .ClientTemplate("<input type='checkbox' disabled='disabled' #= AuthorityReceived ? checked='checked':'' # />");
              columns.Bound(p => p.W9Received)
                     .Title("W9")
                     .Filterable(false)
                     .Width(40)
                     .ClientTemplate("<input type='checkbox' disabled='disabled' #= W9Received ? checked='checked':'' # />");
              columns.Bound(p => p.InsuranceReceived)
                     .Title("Ins")
                     .Filterable(false)
                     .Width(40)
                     .ClientTemplate("<input type='checkbox' disabled='disabled' #= InsuranceReceived ? checked='checked':'' # />");
              columns.Bound(p => p.Phone1).Groupable(false).Title("Phone 1").Width(125);
              columns.Bound(p => p.Phone2).Groupable(false).Title("Phone 2").Width(125);
              columns.Bound(p => p.AfterHoursPhone).Groupable(false).Title("After Hrs #").Width(125);
              columns.Bound(p => p.Email).Groupable(false).Width(125);
              columns.Command(command => command.Custom("ViewComments").Click("showComments"));
          })
      .Groupable()
      .Pageable()
      .Sortable()
      .Scrollable()
      .Filterable()
      .Selectable()
      .Resizable(resize => resize.Columns(true))
      .Reorderable(reorder => reorder.Columns(true))
      .DataSource(
          dataSource => dataSource
                            .Ajax()
                            .PageSize(50)
                            .Read(read => read.Action("CarrierRead", "DataActions")))
      )
 
@(Html.Kendo().Window().Name("Comments")
      .Title("Comments")
      .Visible(false)
      .Modal(true)
      .Draggable(true)
      .Resizable()
      )
 
<script id="comments-template" type="text/x-kendo-template">
    <div id="details-container">
        <h3>#= Name #</h2>
    @(Html.Kendo().Grid<CarrierComment>()
          .Name("grid_#=CarrierId#")
          .Columns(columns =>
              {
                  columns.Bound(o => o.Comment);
                  columns.Bound(o => o.AddedBy).Width(150);
                  columns.Bound(o => o.TimeStamp).Format("{0:MM/dd/yyyy hh:mm tt}").Width(175);
                  columns.Command(command =>
                      {
                          command.Destroy();
                          command.Edit().UpdateText("Save");
                      }).Width(200);
              })
          .DataSource(
              dataSource =>
              dataSource
                  .Ajax()
                  .PageSize(5)
                  .Model(model => model.Id(p => p.CommentId))
                  .Create(update => update.Action("CommentCreate", "DataActions", new {carrierId = "#=CarrierId#"}))
                  .Update(update => update.Action("CommentUpdate", "DataActions"))
                  .Destroy(update => update.Action("CommentDelete", "DataActions"))
                  .Read(read => read.Action("CommentRead", "DataActions", new {carrierId = "#=CarrierId#"}))
          )
          .ToolBar(toolbar => toolbar.Create().Text("New Comment"))
          .Editable(editable => editable.Mode(GridEditMode.InLine))
          .Pageable()
          .Sortable()
          .Selectable()
          .Resizable(resize => resize.Columns(true))
          .Reorderable(reorder => reorder.Columns(true))
          .Scrollable()
          .ToClientTemplate())
    </div>
</script>
 
<script type="text/javascript">
    var detailsTemplate = kendo.template($("#comments-template").html());
 
    function showComments(e) {
        e.preventDefault();
 
        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
        var wnd = $("#Comments").data("kendoWindow");
 
        wnd.content(detailsTemplate(dataItem));
        wnd.center().open();
    }
</script>
[HttpPost]
        public ActionResult CommentRead([DataSourceRequest] DataSourceRequest request, int carrierId)
        {
            try
            {
                var facade = new CarrierFacade();
                var comments = facade.GetAllComments(carrierId);
                return Json(comments.ToDataSourceResult(request));
            }
            catch (DbException ex)
            {
                ViewBag.ErrorMessage = ex.Message;
                return View("Error");
            }
        }
 
        [HttpPost]
        public ActionResult CommentCreate([DataSourceRequest] DataSourceRequest request, CarrierComment comment)
        {
            if (comment != null && ModelState.IsValid)
            {
                try
                {
                    var facade = new CarrierFacade();
                    facade.InsertComment(comment);
                }
                catch (DbException ex)
                {
                    ViewBag.ErrorMessage = ex.Message;
                    return View("Error");
                }
            }
 
            return Json(new[] {comment}.ToDataSourceResult(request, ModelState));
        }
 
        [HttpPost]
        public ActionResult CommentUpdate([DataSourceRequest] DataSourceRequest request, CarrierComment comment)
        {
            try
            {
                var facade = new CarrierFacade();
                facade.UpdateComment(comment);
                return Json(ModelState.ToDataSourceResult());
            }
            catch (DbException ex)
            {
                ViewBag.ErrorMessage = ex.Message;
                return View("Error");
            }
        }
 
        [HttpPost]
        public ActionResult CommentDelete([DataSourceRequest] DataSourceRequest request, CarrierComment comment)
        {
            try
            {
                var facade = new CarrierFacade();
                facade.DeleteComment(comment.CommentId);
                return Json(ModelState.ToDataSourceResult());
            }
            catch (DbException ex)
            {
                ViewBag.ErrorMessage = ex.Message;
                return View("Error");
            }
        }
If I move the Grid out of the window, the model that is passed to my Controller's actions is no longer null.  Any idea why this would be?

3 Answers, 1 is accepted

Sort by
0
Scott
Top achievements
Rank 1
answered on 28 Jun 2013, 01:09 PM
OK, I've figured out the issue.  I was incorrect in saying that moving the grid out of the window fixed the issue.  The Model had a property in it name "Comment", which caused the incoming model to be null.  This appears to be true of ANY class that has a property named "Comment" that is being used as a model for the grid.

Is this a bug?  Is there another workaround other than changing the property name?

Thanks!
0
Daniel
Telerik team
answered on 01 Jul 2013, 03:14 PM
Hello,

The property name is the same as the action parameter name so the model binder will try to bind it to the object and will fail. You should use a different name for the action parameter:

public ActionResult CommentUpdate([DataSourceRequest] DataSourceRequest request, CarrierComment carrierComment)
Regards,
Daniel
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Sam
Top achievements
Rank 1
answered on 23 Mar 2017, 07:07 PM
This post was a helpful clue to me as well.  I was binding a class named "group" which was also the name of another parameter in the Response which through off the model binder.  Changing my class from "group" to "securityGroup" fixed it.  Thanks for the hint!
Tags
Grid
Asked by
Scott
Top achievements
Rank 1
Answers by
Scott
Top achievements
Rank 1
Daniel
Telerik team
Sam
Top achievements
Rank 1
Share this question
or