Details in Grid don't fire the Controller

[Alex]

I'm trying to display details in a grid, but when I put breakpoints in the controller, the app is ignoring the .Read and never hits the controller after the initial load of the page.

Here's my Index.cshtml:

@functions {

    private void AccountGridCommandDef(GridColumnFactory<PosPayAndBankRec.Models.AccountListItem> columns)
 {
  columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
        columns.Bound(p => p.AccountID).Hidden();
        columns.Bound(p => p.SourceName).Title("Source");
        columns.Bound(p => p.BankName).Title("Bank");
        columns.Bound(p => p.AccountName).Title("Account");
        columns.Bound(p => p.AccountNumber).Title("Acct #");
        columns.Bound(p => p.AccountFolderName).Title("Folder");
        columns.Bound(p => p.RamQuestBankNumber).Title("Bank #");
        //columns.ForeignKey(p => p.AccountID, (IEnumerable<ORTAccount>)ViewBag.Accounts, "AccountID", "AccountName");
 }

 private void AccountGridDataSource(DataSourceBuilder<PosPayAndBankRec.Models.AccountListItem> dataSource)
 {
        dataSource.Ajax()
            .Model(AjaxDataSourceBuilder)
            .Sort(sort => sort.Add(p => p.BankName))
            .ServerOperation(true)
            .Create(create => create.Action("Create", "Account"))
            .Read(read => read.Action("Read", "Account"))
            .Update(update => update.Action("Update", "Account"))
            .Destroy(destroy => destroy.Action("Delete", "Account"));
            //.Events(e => e.Error("error"));
 }

 private void AjaxDataSourceBuilder(DataSourceModelDescriptorFactory<PosPayAndBankRec.Models.AccountListItem> model)
 {
        model.Id(p => p.AccountID);
        model.Field(p => p.AccountName);
 }

 private void AccountGridToolBarDef(GridToolBarCommandFactory<PosPayAndBankRec.Models.AccountListItem> toolbar)
 {
  toolbar.Create().Text("New Account");
 }
}

@{ ViewBag.Title = "Accounts"; }
@(Html.Kendo().Grid<PosPayAndBankRec.Models.AccountListItem>()
 .Name("Accounts")
 .Columns(AccountGridCommandDef)
 .DataSource(AccountGridDataSource)
        .ToolBar(AccountGridToolBarDef)
        .Editable(c => c.Mode(GridEditMode.PopUp).Enabled(true).DisplayDeleteConfirmation(true).Window(window => window.Title("Account")).TemplateName("AccountPopup").AdditionalViewData(new { Sources = Model.Sources, Banks = Model.Banks }))
 .Sortable()
    .ClientDetailTemplateId("AccountDetails")
 .Pageable(p => p.Enabled(false))
 .Scrollable(s => { s.Height(375); s.Virtual(true); })
)

     

<script id="AccountDetails" type="text/kendo-tmpl">
    @(Html.Kendo().TabStrip()
            .Name("TabStrip_#=AccountID#")
            .SelectedIndex(0)
            .Items(items =>
                       {
                           items.Add().Text("Details").Content(
                               @<text>
                    @(Html.Kendo().Grid<PosPayAndBankRec.Models.AccountListItem>()
                            .Name("Details_#=AccountID#")
                            .Columns(columns =>
                                        {
                                            columns.Bound(p => p.BankAccountName).Width(101);
                                            columns.Bound(p => p.RamQuestDatabaseName).Width(140);
                                            columns.Bound(p => p.RamQuestBankNumberStacked).Width(200);
                                            columns.Bound(p => p.AccountNotes).Width(200);
                                        })
                            .DataSource(dataSource => dataSource
                                                        .Ajax()
                                                        .Read(read => read.Action("Details", "Account", new {id = "#=AccountID#"}))
                            )
                            .Pageable()
                            .Sortable()
                            .ToClientTemplate())
                </text>);

Here's my AccountController.cs:

using System.Linq;
using System.Linq.Expressions;
using System.Web;
using System.Web.Mvc;
using PosPayAndBankRec.Domain.Models;
using System.Data.Entity;
using PosPayAndBankRec.Models;
using System.Data.Entity.Validation;
using Kendo.Mvc.UI;
using Kendo.Mvc.Extensions;

namespace PosPayAndBankRec.Controllers
{
    public class AccountController : BaseController
    {
        private EFTDBContext db = new EFTDBContext();

        public ActionResult Read([DataSourceRequest] DataSourceRequest request)
        {
            var ortaccounts = (from account in db.ORTAccounts
                              join source in db.ORTSources on account.SourceID equals source.SourceID
                              join bank in db.ORTBanks on account.BankID equals bank.BankID
                              select new AccountListItem()
                              {
                                  AccountID = account.AccountID,
                                  BankID = account.BankID,
                                  SourceID = account.SourceID,
                                  AccountName = account.AccountName,
                                  AccountNumber = account.AccountNumber,
                                  AccountFolderName = account.AccountFolderName,
                                  BankAccountName = account.BankAccountName,
                                  BankName = bank.BankName,
                                  RamQuestBankNumber = account.RamQuestBankNumber,
                                  SourceName = source.SourceName,
                                  RamQuestDatabaseName = account.RamQuestDatabaseName,
                                  RamQuestBankNumberStacked = account.RamQuestBankNumberStacked,
                                  AccountNotes = account.AccountNotes
                              }).ToDataSourceResult(request);

            //var sources = db.ORTSources.ToDataSourceResult(request);
            //var banks = db.ORTBanks.ToDataSourceResult(request);

            //return View(viewData);
            return Json(ortaccounts, JsonRequestBehavior.AllowGet);
        }

        [HttpGet]
        public ActionResult Details(int id)
        {
            var ortaccounts = from account in db.ORTAccounts
                              join source in db.ORTSources on account.SourceID equals source.SourceID
                              join bank in db.ORTBanks on account.BankID equals bank.BankID
                              where account.AccountID == id

                             select new AccountDetailsModel()
                              {
                                  AccountID = account.AccountID,
                                  AccountFolderName = account.AccountFolderName,
                                  AccountName = account.AccountName,
                                  AccountNumber = account.AccountNumber,
                                  BankID = account.BankID,
                                  BankName = bank.BankName,
                                  RamQuestBankNumber = account.RamQuestBankNumber,
                                  SourceName = source.SourceName,
                                  AccountNotes = account.AccountNotes,
                                  BankAccountName = account.BankAccountName,
                                  RamQuestDatabaseName = account.RamQuestDatabaseName,
                                  RamQuestBankNumberStacked = account.RamQuestBankNumberStacked
                              };
            var ortaccount = ortaccounts.FirstOrDefault();
            if (ortaccounts == null)
            {
                return RedirectToAction("Error");
            }
            else
            {
                return View(ortaccount);
            }
        }

[Alex]

I see.  I need to using [GridAction] in the Controller, but now I'm getting an error within the kendo.all.min.js.  I must be returning the data wrong.

[Alex]

I ended up removing the kendo.all.min.js and listed out the .js files one by one.  Now I don't get any errors, but it's still not binding.  My Controller now looks like this:

[GridAction]
        public ActionResult Details(int id)
        {
            var ortaccounts = from account in db.ORTAccounts
                              where account.AccountID == id

                              select new AccountListItem()
                              {
                                  AccountID = account.AccountID,
                                  BankAccountName = account.BankAccountName,
                                  RamQuestDatabaseName = account.RamQuestDatabaseName,
                                  RamQuestBankNumberStacked = account.RamQuestBankNumberStacked,
                                  AccountNotes = account.AccountNotes
                              };
            return View(new GridModel(ortaccounts));
        }

[Alex]

I got it!  The stupid [GridAction] was stopping the data.

It needed to be:

 

public ActionResult Details([DataSourceRequest] DataSourceRequest request, int id)
        {
            var ortcontacts = (from contacts in db.ORTContacts
                              where contacts.BankID == id
                              select new ContactDetailsModel()
                               {
                                   ContactID = contacts.ContactID,
                                   BankID = contacts.BankID,
                                   ContactType = contacts.ContactType,
                                   Description = contacts.Description,
                                   ContactName = contacts.ContactName,
                                   ContactPhone = contacts.ContactPhone,
                                   ContactEmail = contacts.ContactEmail,
                                   ContactNotes = contacts.ContactNotes
                               }).ToDataSourceResult(request);

            return Json(ortcontacts, JsonRequestBehavior.AllowGet);
        }