Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to expand all rows at page load in Kendo UI Grid?

I am working on ASP.NET MVC4 with Kendo UI Grid control.And i am using expand-collapse functionality to show grid rows.

My problem is at the time of page load only the first parent row child elements(rows) are expanding/showing(according to exiting code).And the other parent rows(below the first parent row) are not.

But i want to show all the parent and child rows at the time of page load without any expatiation of parent rows.

Below is piece of code for parent rows :

 @(Html.Kendo().Grid<Gts.Core.Dto.CategoryViewModel>()
    .Name("CategoryItemsGrid")
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(p => p.CategoryID))
        .Read(read => read.Action("CategoryItems","Category").Data("additionalIDetail"))            
    )        

Below is piece of code for child rows :

@(Html.Kendo().Grid<Gts.Core.Dto.CategoryViewModel >()
        .Name("Categories_#=CategoryID#")    
        .DataSource(dataSource => dataSource
             .Ajax()
             .Model(model => model.Id(p => p.CategoryItemID))
             .Read(read => read.Action("CategoryChildItems", "Category", new { CategoryItemID = "#=CategoryItemID#", categoryId = "#=FKCategoryID#" }))
                    .Destroy(update => update.Action("CategoryItemsDestroy", "Category"))
                )

Can anyone knows how to fix it ?

like image 382
Pawan Avatar asked Oct 20 '22 16:10

Pawan


2 Answers

As provided in the comments above.

Kendo UI Grid does have an Expand All option.

Look here : How to expand all detail rowsi n a kendo grid

like image 65
Umair Khan Avatar answered Oct 24 '22 00:10

Umair Khan


Haven't done much with MVC lately (sorry about that). This is web implementation.

If for some strange reason you are having issues with just passing the collection to the dataBound handler of the grid:

    dataBound: function() {
    this.expandRow(this.tbody.find("tr.k-master-row"));
}

Try manually looping through it

 dataBound: function () {
            var that = this;

            $.each(that.tbody.find("tr.k-master-row"), function (key, value) {
                that.expandRow(value);
            });
        }
like image 21
Houdini Sutherland Avatar answered Oct 24 '22 00:10

Houdini Sutherland