[Solved] Grid Item Details Won't Load

[Scott]

Hi,

I am trying to get a grid with hierarchical data working, where the item detail is another grid.  So, I have a grid of "Carriers", and those Carriers all have a list of Comments.  My carrier grid loads fine, however the details do no load.  The sub-grid itself renders, but the Action never gets hit to load the data. 

The project is an MVC 4 project created in Visual Studio 2012 using the Kendo UI for MVC template.

My Controller (The "facade" is simply a class that accesses my data layer and gets my objects, suffice to say, it returns an IList<Carrier> and IList<CarrierComment>)...        

public class HomeController : Controller
    {
        //
        // GET: /Home/
        [HttpGet]
        public ActionResult Index()
        {
            return View();
        }

        // Carrier Actions

        //
        // POST: /ReadCarriers/
        [HttpPost]
        public ActionResult CarrierRead([DataSourceRequest] DataSourceRequest request)
        {
            try
            {
                var facade = new CarrierFacade();
                IList<Carrier> carriers = facade.GetAllCarriers();
                return Json(carriers.ToDataSourceResult(request));
            }
            catch (DbException ex)
            {
                ViewBag.ErrorMessage = ex.Message;
                return View("Error");
            }
        }

        // Comment Actions

        //
        // POST: /CommentRead/
        [HttpPost]
        public ActionResult CommentRead([DataSourceRequest] DataSourceRequest request, int carrierId)
        {
            try
            {
                var facade = new CarrierFacade();
                IList<CarrierComment> comments = facade.GetAllComments(carrierId);
                return Json(comments.ToDataSourceResult(request));
            }
            catch (DbException ex)
            {
                ViewBag.ErrorMessage = ex.Message;
                return View("Error");
            }
        }
}

My View....

@using HappyHolidays.WebPortal.BusinessObjects
@{
    ViewBag.Title = "Carrier Directory";
}

@(Html.Kendo().Grid<Carrier>()
      .Name("grid")
      .Columns(columns =>
          {
              columns.Bound(p => p.Name).Groupable(false);
              columns.Bound(p => p.Phone1).Groupable(false).Title("Primary Phone");
              columns.Bound(p => p.Phone2).Groupable(false).Title("Secondary Phone");
              columns.Bound(p => p.Fax).Groupable(false);
              columns.Command(command =>
                  {
                      command.Edit();
                      command.Destroy();
                  });
          })
      .ToolBar(toolbar => toolbar.Create())
      .Editable(editable => editable.Mode(GridEditMode.PopUp))
      .Groupable()
      .Pageable()
      .Sortable()
      .Scrollable()
      .Filterable()
      .Selectable()
      .Resizable(resize => resize.Columns(true))
      .Reorderable(reorder => reorder.Columns(true))
      .ClientDetailTemplateId("carrier-detail")
      .DataSource(
          dataSource => dataSource
                            .Ajax()
                            .PageSize(50)
                            .Model(model =>
                                {
                                    model.Id(p => p.CarrierId);
                                    model.Field(p => p.CarrierId).Editable(false);
                                })
                            .Create(update => update.Action("CarrierCreate", "Home"))
                            .Update(update => update.Action("CarrierUpdate", "Home"))
                            .Destroy(update => update.Action("CarrierDelete", "Home"))
                            .Read(read => read.Action("CarrierRead", "Home"))))

<script id="carrier-detail" type="text/x-kendo-template">
    @(Html.Kendo().Grid<CarrierComment>()
          .Name("commentsGrid#=CarrierId#")
          .Columns(columns =>
              {
                  columns.Bound(o => o.Comment);
                  columns.Bound(o => o.AddedBy);
                  columns.Bound(o => o.TimeStamp);
              })
          .DataSource(dataSource => dataSource
                                        .Ajax()
                                        .Read(read => read.Action("CommentRead", "Home", new { carrierID = "#=CarrierId#" }))
          )
          .Pageable()
          .Sortable()
          .ToClientTemplate()
          )
</script>

My layout page...

<!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.common.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.metro.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2013.1.514/kendo.dataviz.metro.min.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/kendo/2013.1.514/jquery.min.js")"> </script>
    <script src="@Url.Content("~/Scripts/kendo/2013.1.514/kendo.all.min.js")"> </script>
    <script src="@Url.Content("~/Scripts/kendo/2013.1.514/kendo.aspnetmvc.min.js")"> </script>
    <script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"> </script>
</head>
<body>
    <div>
        @RenderBody()
    </div>
</body>
</html>

As I said, the carriers grid loads fine, however when I expand a row, the comments grid is empty.  If I place a break point at CommentsRead() in the controller, it never gets called.  I am clearly missing a piece of the puzzle, but I can't figure it out and I've been at it for a day and a half.

Thanks,
Andy

[Scott]

I should have included my "models"...

public class Carrier
    {
        #region Properties

        /// <summary>
        /// Gets or sets the carrier's id.
        /// </summary>
        /// <value>
        /// The id.
        /// </value>
        [Editable(false)]
        [Key]
        public int CarrierId { get; set; }

        /// <summary>
        ///     Gets or sets the name.
        /// </summary>
        /// <value>
        ///     The name.
        /// </value>
        [Required]
        public string Name { get; set; }

        /// <summary>
        ///     Gets or sets the address.
        /// </summary>
        /// <value>
        ///     The address.
        /// </value>
        public Address Address { get; set; }

        /// <summary>
        ///     Gets or sets the phone1.
        /// </summary>
        /// <value>
        ///     The phone1.
        /// </value>
        [Display(Name = "Primary Phone")]
        public string Phone1 { get; set; }

        /// <summary>
        ///     Gets or sets the phone2.
        /// </summary>
        /// <value>
        ///     The phone2.
        /// </value>
        [Display(Name = "Secondary Phone")]
        public string Phone2 { get; set; }

        /// <summary>
        ///     Gets or sets the fax.
        /// </summary>
        /// <value>
        ///     The fax.
        /// </value>
        public string Fax { get; set; }

        /// <summary>
        ///     Gets or sets the email.
        /// </summary>
        /// <value>
        ///     The email.
        /// </value>
        public string Email { get; set; }

        /// <summary>
        ///     Gets or sets the insurance.
        /// </summary>
        /// <value>
        ///     The insurance.
        /// </value>
        public string Insurance { get; set; }

        /// <summary>
        ///     Gets or sets the authority.
        /// </summary>
        /// <value>
        ///     The authority.
        /// </value>
        public string Authority { get; set; }

        /// <summary>
        ///     Gets or sets the w9.
        /// </summary>
        /// <value>
        ///     The w9.
        /// </value>
        public string W9 { get; set; }

        /// <summary>
        /// Gets or sets a value indicating whether this instance is active.
        /// </summary>
        /// <value>
        ///   <c>true</c> if this instance is active; otherwise, <c>false</c>.
        /// </value>
        [Display(Name = "Active ?")]
        public bool IsActive { get; set; }

        /// <summary>
        ///     Gets or sets the contacts.
        /// </summary>
        /// <value>
        ///     The contacts.
        /// </value>
        public ICollection<Contact> Contacts { get; set; }

        /// <summary>
        ///     Gets or sets the comment history.
        /// </summary>
        /// <value>
        ///     The comment history.
        /// </value>
        public ICollection<CarrierComment> CommentHistory { get; set; }

        #endregion

        #region Operators

        /// <summary>
        ///     Implements the operator ==.
        /// </summary>
        /// <param name="item1">The item1.</param>
        /// <param name="item2">The item2.</param>
        /// <returns>The result of the operator.</returns>
        public static bool operator ==(Carrier item1, Carrier item2)
        {
            // if both null, equal
            if (ReferenceEquals(item1, null) && ReferenceEquals(item2, null))
                return true;

            // if one null, one not, not equal
            if (!ReferenceEquals(item1, null) && ReferenceEquals(item2, null))
                return false;

            if (ReferenceEquals(item1, null))
                return false;

            return item1.Equals(item2);
        }

        /// <summary>
        ///     Implements the operator !=.
        /// </summary>
        /// <param name="item1">The item1.</param>
        /// <param name="item2">The item2.</param>
        /// <returns>The result of the operator.</returns>
        public static bool operator !=(Carrier item1, Carrier item2)
        {
            return !(item1 == item2);
        }

        #endregion

        #region Object Methods

        /// <summary>
        ///     Returns a <see cref="T:System.String" /> that represents the current <see cref="T:System.Object" />.
        /// </summary>
        /// <returns>
        ///     A <see cref="T:System.String" /> that represents the current <see cref="T:System.Object" />.
        /// </returns>
        public override string ToString()
        {
            return Name;
        }

        /// <summary>
        ///     Determines whether the specified <see cref="T:System.Object"></see> is equal to the current
        ///     <see
        ///         cref="T:System.Object">
        ///     </see>
        ///     .
        /// </summary>
        /// <param name="obj">
        ///     The <see cref="T:System.Object"></see> to compare with the current <see cref="T:System.Object"></see>.
        /// </param>
        /// <returns>
        ///     true if the specified <see cref="T:System.Object"></see> is equal to the current <see cref="T:System.Object"></see>; otherwise, false.
        /// </returns>
        public override bool Equals(object obj)
        {
            var item = obj as Carrier;

            if (item != null)
            {
                return Equals(item);
            }

            return base.Equals(obj);
        }

        /// <summary>
        ///     Determines whether the specified <see cref="Carrier"></see> is equal to the current <see cref="Carrier"></see>.
        /// </summary>
        /// <param name="item">The item.</param>
        /// <returns>
        ///     true if the specified <see cref="Carrier"></see> is equal to the current <see cref="Carrier"></see>; otherwise, false.
        /// </returns>
        public bool Equals(Carrier item)
        {
            if (item != null)
            {
                return CarrierId == item.CarrierId;
            }

            return false;
        }

        /// <summary>
        ///     Serves as a hash function for a particular type. <see cref="M:System.Object.GetHashCode"></see> is suitable for use in hashing algorithms and data structures like a hash table.
        /// </summary>
        /// <returns>
        ///     A hash code for the current <see cref="T:System.Object"></see>.
        /// </returns>
        public override int GetHashCode()
        {
            return CarrierId.GetHashCode();
        }

        #endregion
    }


public class CarrierComment
    {
        #region Properties

        /// <summary>
        ///     Gets or sets the comment's id.
        /// </summary>
        /// <value>
        ///     The id.
        /// </value>
        [Editable(false)]
        [Key]
        public int CommentId { get; set; }

        /// <summary>
        ///     Gets or sets who added this comment.
        /// </summary>
        /// <value>
        ///     The added by.
        /// </value>
        [Required]
        [Display(Name = "Added By")]
        public string AddedBy { get; set; }

        /// <summary>
        ///     Gets or sets the comment.
        /// </summary>
        /// <value>
        ///     The comment.
        /// </value>
        [Required]
        public string Comment { get; set; }

        /// <summary>
        ///     Gets or sets the time stamp that the comment was added.
        /// </summary>
        /// <value>
        ///     The time stamp.
        /// </value>
        [Editable(false)]
        public DateTime TimeStamp { get; set; }

        #endregion

        #region Operators

        /// <summary>
        ///     Implements the operator ==.
        /// </summary>
        /// <param name="item1">The item1.</param>
        /// <param name="item2">The item2.</param>
        /// <returns>The result of the operator.</returns>
        public static bool operator ==(CarrierComment item1, CarrierComment item2)
        {
            // if both null, equal
            if (ReferenceEquals(item1, null) && ReferenceEquals(item2, null))
                return true;

            // if one null, one not, not equal
            if (!ReferenceEquals(item1, null) && ReferenceEquals(item2, null))
                return false;

            if (ReferenceEquals(item1, null))
                return false;

            return item1.Equals(item2);
        }

        /// <summary>
        ///     Implements the operator !=.
        /// </summary>
        /// <param name="item1">The item1.</param>
        /// <param name="item2">The item2.</param>
        /// <returns>The result of the operator.</returns>
        public static bool operator !=(CarrierComment item1, CarrierComment item2)
        {
            return !(item1 == item2);
        }

        #endregion

        #region Object Methods

        /// <summary>
        ///     Returns a <see cref="T:System.String" /> that represents the current <see cref="T:System.Object" />.
        /// </summary>
        /// <returns>
        ///     A <see cref="T:System.String" /> that represents the current <see cref="T:System.Object" />.
        /// </returns>
        public override string ToString()
        {
            return Comment;
        }

        /// <summary>
        ///     Determines whether the specified <see cref="T:System.Object"></see> is equal to the current
        ///     <see
        ///         cref="T:System.Object">
        ///     </see>
        ///     .
        /// </summary>
        /// <param name="obj">
        ///     The <see cref="T:System.Object"></see> to compare with the current <see cref="T:System.Object"></see>.
        /// </param>
        /// <returns>
        ///     true if the specified <see cref="T:System.Object"></see> is equal to the current <see cref="T:System.Object"></see>; otherwise, false.
        /// </returns>
        public override bool Equals(object obj)
        {
            var item = obj as CarrierComment;

            if (item != null)
            {
                return Equals(item);
            }

            return base.Equals(obj);
        }

        /// <summary>
        ///     Determines whether the specified <see cref="CarrierComment"></see> is equal to the current
        ///     <see
        ///         cref="CarrierComment">
        ///     </see>
        ///     .
        /// </summary>
        /// <param name="item">The item.</param>
        /// <returns>
        ///     true if the specified <see cref="CarrierComment"></see> is equal to the current <see cref="CarrierComment"></see>; otherwise, false.
        /// </returns>
        public bool Equals(CarrierComment item)
        {
            if (item != null)
            {
                return CommentId == item.CommentId;
            }

            return false;
        }

        /// <summary>
        ///     Serves as a hash function for a particular type. <see cref="M:System.Object.GetHashCode"></see> is suitable for use in hashing algorithms and data structures like a hash table.
        /// </summary>
        /// <returns>
        ///     A hash code for the current <see cref="T:System.Object"></see>.
        /// </returns>
        public override int GetHashCode()
        {
            return CommentId.GetHashCode();
        }

        #endregion
    }

[Scott]

OK, it's going now. I'm not really sure why.  I came back from other tasks, fired it up to start looking again and it was working.