Recently we are trying to migrate our existing application from telerik to Kendo ui controls. In one of the page we have telerik splitter and its panel contains telerik tab strip which internally loads telerik grid.
Now we replaced telerik splitter to kendo ui splitter and remaining are same in telerik. Once after running the application telerik grid is not being loaded properly.
Please guide me here.
Thanks,
Srikanth
10 Answers, 1 is accepted
The provided information is scarce and does not lead to any conclusive suggestion. Please clarify what do you mean by "not loaded properly" or even better, provide a live URL or a runnable example, so that I can test it and give further advice.
Regards,
Dimo
the Telerik team
Rank 1
I'm also having issues when putting a grid inside the splitter using kendo ASP.NET Core
I'm using the .Content(() =>{ Html.Kendo.Grid<GridViewModel>() .... .Defered( ); }).Defered( ) on the splitter, if I take the code from inside the .Content( ) of the splitter and place it on the page all works as expected?
How can I get a grid inside a splitter ?
I checked the Grid nested in a Splitter scenario and at my end the Grid was displayed correctly. Could you give the following syntax a try making sure you call the Grid's .ToHtmlString() method:
.Content( Html.Kendo.Grid<GridViewModel>().... .ToHtmlString());Regards,
Ivan Danchev
Progress Telerik
Rank 1
I've tried this without success and I've also seen issues with the following not displaying the tab content =>
@(Html.Kendo().Splitter()
.Name("search-item-details-splitter")
.Orientation(SplitterOrientation.Vertical)
.Panes(panes =>
{
panes.Add()
.Collapsible(false)
.Resizable(true)
.Scrollable(true);
panes.Add()
.Collapsible(false)
.Resizable(true)
.Scrollable(true)
.Content(
Html.Kendo().TabStrip()
.Name("search-item-detail-tab-strip")
.Animation(true)
.Items(items =>
{
items.Add()
.Text("Tab 01")
.Enabled(true)
.Content(
Html.Kendo().Button().Name("d1").Content("d1").ToHtmlString()
);
items.Add()
.Text("Tab 02")
.Enabled(true)
.Content(
Html.Kendo().Button().Name("d2").Content("d2").ToHtmlString()
);
items.Add()
.Text("Meter History")
.Enabled(true)
.Content(
Html.Kendo().Button().Name("d3").Content("d2").ToHtmlString()
);
})
.ToHtmlString()
);
}).Deferred())
any help much appreciated
I attached a sample runnable project, in which both a Grid and the TabStrip from your last reply are placed within a Splitter and both are visible. Could you modify the sample so that it reproduces the issue and attach it back for further review?
Regards,
Ivan Danchev
Progress Telerik
Rank 1
Rank 1
This is an issue where following the best practise of placing stylesheets with in the <head> tag and scripts to the bottom of the page, the behaviour expected is not achieved; even with the line @(Html.Kendo().DeferredScripts()) the content( ... ) don't render ?
I have been able to re-produced the issue by simply moving the script tags to the bottom of the page; as recommended in your documentation.
Since there are no script tags in the Index view from the example I attached in my previous reply, could you elaborate more on which script tags in particular you moved to the bottom of the page? If you are moving the Kendo UI scripts loaded in _Layout.cshtml to the bottom of the page you will have to call @Html.Kendo().DeferredScripts() after the scripts:
<script src="https://kendo.cdn.telerik.com/2017.2.621/js/jquery.min.js"></script><script src="https://kendo.cdn.telerik.com/2017.2.621/js/jszip.min.js"></script><script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.all.min.js"></script><script src="https://kendo.cdn.telerik.com/2017.2.621/js/kendo.aspnetmvc.min.js"></script>@Html.Kendo().DeferredScripts()In addition all of the widgets' Deferred() method need to be called: the Splitter, Grid, TabStrip and the three buttons within the TabStrip. This way all of them will be initialized after loading the jQuery and Kendo UI scripts they depend on.
Regards,
Ivan Danchev
Progress Telerik
Rank 1
The buttons within the TabStrip, the TabStrip itself and the Grid should call both the Deferred() and the ToHtmlString() methods, for example:
Html.Kendo().Button().Name("d1").Content("d1").Deferred().ToHtmlString()The Splitter should call only the Deferred() method.
Regards,
Ivan Danchev
Progress Telerik