Kendo UI MVC Grid with Kendo Window - 500 error

Question

So I have been banging my head against this problem for a while now, so first let me explain what I need to do, then I will go into where I am at.

This is an asp.net mvc application. The part of my application I am struggling with needs to do this:

1. Display the main grid which utilizes popups for adding & editing
2. Display Add & Edit buttons
3. Display a hyperlink column which should open a popup with a grid
4. Display custom command button which should open a popup with a grid

1 & 2 works as expected.

I am currently trying to create the Kendo Window with secondary grids in #3 & #4 by loading a partial view, then calling a refresh on the controller action for that Kendo Window. I am able to save the data correctly from these windows, but the grid is not populating with the data from the controller action (although I am able to debug that the code returns data in the action) and I receive a 500 error in the browser console.

Main Grid:

@(Html.Kendo().Grid<PAUL.Models.Response.DetailsViewModel>()
  .Name("PaymentGrid")
  .Columns(columns =>
  {
      columns.Bound(c => c.PMT_DTL_SK).Width(110);
      columns.Bound(c => c.CommentsField).Title("Comments").ClientTemplate("<a onclick=\"showDetails('#=PMT_DTL_SK#')\" style='cursor:auto'>#=CommentsField#</a>").Width(110);
      columns.Command(command => command.Edit().Text("Lookup")).Width(100);
      columns.Command(command => command.Custom("Ignore").Click("ignoreRecord")).Width(180);
  })
  .ToolBar(toolbar =>
  {
      toolbar.Excel();
      toolbar.Create();
  })
  .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("_EditPayment"))
  .Pageable()
  .Events(events =>
  {
      events.Save("onSave");
      events.Edit("HideGridFields");
      events.DataBound("onDataBound");
  })
  .DataSource(dataSource => dataSource
      .Ajax()
      .Model(model => model.Id(p => p.PMT_DTL_SK))
      .PageSize(300)
      .Create(create => create.Action("Payment_Create", "Landing"))
      .Update(update => update.Action("Payment_Update", "Landing", @Model))
      .Read(read => read.Action("Payments_Read", "Landing", @Model))
      .Events(events => events.Sync("sync_handler"))
  ))

Script & Kendo Window code for the Comments Hyperlink:

@(Html.Kendo().Window().Name("Comments")
.Title("Letter Date/Comments")
.Visible(false)
.LoadContentFrom("Comments", "Landing")
.Modal(true)
.Draggable(true)
.Width(450))

<script type="text/javascript">
function showDetails(paymentDetailSK) {
    var wnd = $("#Comments").data("kendoWindow");
    wnd.refresh({
        url: "/Landing/GetComments",
        data: { paymentDetailSK: paymentDetailSK }
    });
    wnd.center().open();
}</script>

LandingContoller - GetComments action

    public ActionResult GetComments([DataSourceRequest]DataSourceRequest request, Decimal? paymentDetailSK)
    {
        var comments = new PAULDataRepository().Comments_Read(paymentDetailSK).ToList();

        return Json(comments.ToDataSourceResult(request));
    }

The grid in _Comments partial view:

    <div class="row">
    @(Html.Kendo().Grid<PAUL.Entities.PaymentDetailAttachment>()
    .Name("commentsGrid")
    .Columns(columns =>
    {
        columns.Bound(c => c.CommentText).Title("Comments");
        columns.Bound(c => c.CreatedByUser).Title("Created By");
        columns.Bound(c => c.CreatedDateTime).Title("Creation Time").Format("{0:MM/dd/yyyy HH:mm tt}");
    })
    .HtmlAttributes(new { style = "height: 250px;" })
    .Scrollable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("GetComments", "Landing"))
        .PageSize(20)
    )
    )
</div>

I have tried to set the data type for the wnd.refresh to json, and also tried changing actions etc to force a get or post, without luck.

Answer 1

It turns out I was calling the data method when doing the refresh instead of the action action which returns the partial view.