Using PartialViews with Grid Sorting & Paging

[Richard Weeks]

I have a MVC3 View with a TabStrip as:

@{
Html.Telerik().TabStrip()
.Name("TabStrip")
.Items(tabstrip =>
{
tabstrip.Add().Text("Tab One").LoadContentFrom("TabOnePartialView", "Tabbed"); ;
tabstrip.Add().Text("Tab Two").LoadContentFrom("TabTwoPartialView", "Tabbed"); ;
})
.SelectedIndex(0)
.Render();
} 
 
The controller is very simple and works fine in returning data for binding:

public ActionResult TabOnePartialView()
{
using (new UnitOfWorkScope(false))
{
var entities = new MyFacade().SelectEntities();

return this.PartialView(entities);
}
}

TabOnePartialView contains a Grid:

@model IEnumerable<MyEntity>

@(Html.Telerik().Grid<MyEntity>().Name("Grid").BindTo(Model).Columns(columns =>
{
columns.Bound(p => p.Id);
columns.Bound(p => p.ColumnOne);
columns.Bound(p => p.ColumnTwo);
})
.DataBinding(dataBinding => dataBinding.Server().Select("TabOnePartialView", "Tabbed"))
.Sortable(sorting => sorting.Enabled(true))
.Pageable(paging => paging.Enabled(true))
.Filterable(filtering => filtering.Enabled(true))
.Groupable(grouping => grouping.Enabled(true))
.Footer(true))

Loading the Grid, everything is fine. But if I go to another page or try to filter, only the partial view is rendered (the parent view is lost).

How can I configure my Grid to load the parent view as well as the partial view (with the correct data) when filtering, sorting, etc.?

Richard

P.s. Sorry but the Format Code Block link is not responding, so I have provided code listings in plain text.

[Petur Subev]

Hi Richard,

You should configure your Grid to use Ajax binding. For a sample implementation check this online demo.

Kind regards,
Petur Subev
the Telerik team