or
@{ var MainMenu = Html.Kendo().Menu().Name("MainMenu").Orientation(MenuOrientation.Horizontal); foreach (var NavigationItem in Model.NavigationTree.OrderBy(Item => Item.DisplayOrder)) { var Item = NavigationItem; if (Item.SubNavigationItems.Any()) { MainMenu.Items(Items => Items.Add().Text(Item.Name).Content(@<text>@Html.Partial(MVC.Shared.Views.SubNavigation, Item.SubNavigationItems)</text>)); } else { MainMenu.Items(Menu => Menu.Add().Text(Item.Name).Content(@<text>@Html.Raw(File.ReadAllText(Server.MapPath(@"~/HtmlContent/Menu." + Item.Name + ".html")))</text>)); } } } @MainMenu<div id="mainmenu"> <ul class="k-widget k-reset k-header k-menu k-menu-horizontal" id="MainMenu" data-role="menu"> <li class="k-item k-state-default k-first"> <a class="k-link" href="#MainMenu-1"> Service Management <span class="k-icon k-i-arrow-s"></span> </a> <ul class="k-group"> <li class="k-item k-state-default k-first k-last"> <div class="k-content" id="MainMenu-1"> ........ </div> </li> </ul> </li> ........ </ul> <script> jQuery(function(){jQuery("#MainMenu").kendoMenu({});}); </script> </div><link rel="stylesheet" href="@Url.Content("~/Content/kendo.common.css")"/><link rel="stylesheet" href="@Url.Content("~/Content/kendo.default.css")" /><script src="@Url.Content("~/Scripts/jquery-1.7.1.js")"></script><script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.js")"></script><script src="@Url.Content("~/Scripts/kendo.all.js")"></script><script src="@Url.Content("~/Scripts/kendo.aspnetmvc.js")"></script>// Create Editor@(Html.Kendo().Editor() .Name("AboutHotel") .HtmlAttributes(new { style = "width:100%; height:200px" }) )@(Html.Kendo.Grid<Model>() .DataSource(dataSource => dataSource .Read("JsonAction", "Controller") .Filter(filter => { filter.Add(f => f.ID) .IsEqualTo(ViewBag.ID)); filter.Add(f => f.StartDate) .IsGreaterThan(ViewBag.StartDate) .And() .IsLessThan(ViewBag.EndDate) }) ))var filterExpression = { logic: 'and', field: 'PublisherID', operator: 'eq', value: @Session["PublisherID"], filters: [ { field: 'StartDate', operator: 'gte', value: startDate, logic: 'and' }, { field: 'StartDate', operator: 'lte', value: endDate } ] };grid.dataSource.filter(filterExpression);grid.dataSource.read();@(Html.Kendo() .Grid(Model.Items) .Name("Grid") .Pageable(pager => pager.Input(false).Numeric(true).Info(true).PreviousNext(true).Refresh(false)) .HtmlAttributes(new { @class = "datatable" }) .DataSource(dataSource => dataSource.Ajax().ServerOperation(false).PageSize(250).Events(events => events.Error("paging_OnError")).Model(model => { model.Id(p => p.Id); })) .Filterable(filter => filter.Enabled(false)) .Navigatable() .Scrollable(resize => resize.Enabled(false)) .Resizable(resize => resize.Columns(false)) .Reorderable(reorder => reorder.Columns(false)) .Sortable(sorting => sorting.SortMode(GridSortMode.SingleColumn)) .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row)) .ColumnMenu(menu => menu.Enabled(true)) .Columns(columns => { columns.Bound(m => m.Id).ClientTemplate("<input id='checkedRecords' type='checkbox' value='#=Id#' />").Title("").Width(10).HtmlAttributes(new { style = "text-align:center", @class = "checkBox" }).HeaderTemplate(@<text><input type="checkbox" title="check all rows" id="checkAllRows" style = "text-align:center;"/></text>).HeaderHtmlAttributes(new { style = "text-align:center;" }).Filterable(false).Sortable(false).IncludeInMenu(false); columns.Bound(m => m.PublicationDate).Title("Publication date").Width(130).Filterable(true).Sortable(true); columns.Bound(m => m.Title).Title("Title").ClientTemplate("<a href='Article/Detail/#=Id#' alt='' target='_blank'>#=Title#</a>").Filterable(true).Sortable(true); }) .ClientDetailTemplateId("customTemplate"))<script id="customTemplate" type="text/kendo-tmpl"> @(Html.Kendo() .Grid<Model.ResultModel>() .Name("#=Id#") .Sortable(sort => sort.Enabled(false)) .Columns(columns => { columns.Bound(m => m.Id).ClientTemplate("<input id='checkedRecords' type='checkbox' value='#=Id#' />").Title("").Width(10).HtmlAttributes(new { style = "text-align:center", @class = "checkBox" }); columns.Bound(m => m.PublicationDate).Title("Publication date").Width(130); columns.Bound(m => m.Title).Title("Title").ClientTemplate("<a href='/Article/Detail/#=Id#' alt='' target='_blank'>#=Title#</a>"); }) .DataSource(dataSource => dataSource .Ajax() .Read(read => read.Action("GetChildren", "Grid", new { Count = "#=Count#" })) .Model(model => { model.Id(m => m.Id); }) ) .ToClientTemplate() )</script>function onSelect() { //var reviewCategoryGrid = $("#ReviewCategoryGrid").data("kendoGrid"); //reviewCategoryGrid.dataSource.read(); var gridItem = $("#ReviewItemGrid"); var gridItemGrid = $("#ReviewItemGrid").data("kendoGrid"); var gridCategory = $("#ReviewCategoryGrid"); var gridCategoryGrid = $("#ReviewCategoryGrid").data("kendoGrid"); var dataAreaCategory = gridCategory.find(".k-grid-content"); var dataArea = gridItem.find(".k-grid-content"); var newGridHeight = 600; var newDataAreaHeight = newGridHeight - 100; dataArea.height(newDataAreaHeight); gridItem.height(newGridHeight); // gridItemGrid.refresh(); dataAreaCategory.height(newDataAreaHeight); gridCategory.height(newGridHeight); // gridCategoryGrid.refresh(); }function selectReviewCategory(reviewCategoryID, category) { reviewCategoryId = reviewCategoryID; //reviewCategoryTitle = Title; var reviewItemGrid = $("#ReviewItemGrid").data("kendoGrid"); reviewItemGrid.dataSource.read(); var tabstrip = $("#tabstrip").data("kendoTabStrip"); //var tabContent = $("#tabStrip").data("kendoTabStrip").contentElements(0); var tabReview = $("#reviewCategoriesTab"); tabReview.children(".k-link").text(category); tabstrip.select("#reviewItemsTab");}reviewItemGrid.dataSource.read(); line the rendering is ok (but of course with no data).
I have tried to move the tabstrip.select statement to the change event of the datasource of the grid. But that did not have an effect. What shall I do ?
Thanks
Ole
