I have a cshtml page that contains a panelbar with 6 items. Each item uses Ajax to load content based
on a partial view that contains a grid e.g.:
@(Html.Kendo().PanelBar()
.Name("panelbar")
.ExpandMode(PanelBarExpandMode.Single)
.Animation(animation =>
{
animation.Enable(true);
animation.Expand(config =>
{
config.Expand();
config.Fade(FadeDirection.In);
config.Duration(AnimationDuration.Fast);
});
})
.Items(panelbar =>
{
panelbar.Add()
.Text(String.Format("{0} [{1} Items]", "One",@Model.MyOpenObligations ))
.ImageUrl(Url.Content("~/Contents/Images/White_Triangle.png"))
.Encoded(false)
.Selected(true)
.Expanded(true)
.LoadContentFrom("ListFilteredObligations", "MyController");
etc etc................
The partial view that is loaded by each panel item contains a grid that uses ClientTemplates for specfic columns
e.g. :
@(Html.Kendo().Grid(Model)
.Name("obligationGrid")
.Columns(columns =>
{
columns.Bound(p => p.ReferenceNumber);
columns.Bound(p => p.Extract);
columns.Bound(p => p.Clause);
columns.Bound(p => p.Party).ClientTemplate("#= Party ? Party.DisplayName : ''# ").Title("Party");
})
....etc etc
The ClientTemplate columns are rendered OK when the first panel item is expanded (see attached screen shot).
However, when subsequent panel items are expended the grid client template columns display the entire child object (see attached screen shot).We only see this issue when using the grids within the PanelBar control.