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

Weird rendering behavior for multiple grids on a page

1 Answer 158 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Lay
Top achievements
Rank 1
Lay asked on 16 Oct 2015, 06:04 PM

I am using Razor MVC3 and using KendoUI 2014.3.1411.440. I currently have a page that displays group of records in multiple kendo grids. Here's a snippet:

@foreach(var item in Model.Items)
{
@Html.Kendo().Grid(item.Records).Name("Grid").Columns(columns =>
            {
                columns.Bound(x => x.DateCompleted).Format("{0:yyyy-MM-dd}").Title("Date Completed").Width(80).Sortable(true);
                columns.Bound(x => x.Title).Template(@<text><a href="~/details/@item.Id">@item.Title</a></text>).Title("Title").Width(200).Sortable(true);
                columns.Bound(x => x.Status).Title("Status").Width(80).Sortable(true);
            }).Scrollable().Sortable().DataSource(d => d.Ajax().Sort(sort => sort.Add("DateCompleted").Descending()).ServerOperation(false))

}

What's strange here is that the FIRST grid rendered will NOT use the Template I specified in the 2nd column. Instead, it just displays the Title property as plain text. On the other hand, the other grids uses the Template. When I research on possible solutions, I was told that since I am using Ajax, I need to use ClientTemplate instead of Template. I followed this recommendation and the inverse occurred when the page is rendered. The FIRST grid displays what the ClientTemplate is set to while the other grids ignore it.

Has anyone seen this before? I'm completely stumped on this.

Thanks in advance.

 

 

 

 

1 Answer, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 20 Oct 2015, 08:48 AM

Hello Lay,

 

What I notice in this code is that all grids have same name value set to "Grid". The Kendo UI Grid for AS.NET MVC will renders a div element with id attribute set to the value defined as "Name". Then the widget is initialized using that HTML element.  

 

In general having more than one element with same "id" attribute values is not good practice. Please refer to the Two HTML elements with same id attribute: How bad is it really? discussion for more information. 

 

We suggest defining a unique "Name" for each widget on the page in order to avoid such problems. 

 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Lay
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Share this question
or