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

Yet another kendo is not defined thread

3 Answers 1449 Views

General Discussions

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

Dina asked on 10 May 2017, 07:05 AM

Why with upgrade from 2017.1.223 to 2017.2.504 I need to move including of kendo scripts at front of page after body?

In 2017.1.223 I simply include jquery after body (this is unavoidable I guess) and add all other at end of page. But then I upgrade to 2017.2.504 I get "kendo is not defined" (rolling back to 2017.1.223 solves). Also I even did not upgrade bower package in this situation. Just nuget.

so next is _layout.cshtml as to was (working on 2017.1.223 and do not on 2017.2.504 )

and second block works with 2017.2.504

Please tell me if I`am wrong but it is better to shove scripts to the bottom for page rendering performance.

was

<body>

<environment names="Development">

<script src="~/lib/jquery/dist/jquery.js"></script>

</environment>

<environment names="Staging,Production">

<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.2.1.min.js"

asp-fallback-src="~/lib/jquery/dist/jquery.min.js"

asp-fallback-test="window.jQuery"

crossorigin="anonymous"

integrity="sha384-3ceskX3iaEnIogmQchP8opvBy3Mi7Ce34nWjpBIwVTHfGYWQS9jwHDVRnpKKHJg7">

</script>

</environment>

<nav class="navbar navbar-inverse navbar-fixed-top">

<div class="container">

<div class="navbar-header">

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

<span class="sr-only">Toggle navigation</span>

<span class="icon-bar"></span>

</button>

<a asp-area="" asp-controller="Home" asp-action="Index" class="navbar-brand">TNPK</a>

</div>

<div class="navbar-collapse collapse">

<ul class="nav navbar-nav">

@if (SignInManager.IsSignedIn(User))

{

<li><a asp-area="" asp-controller="Codeword" asp-action="Index">Кодовые слова</a></li>

}

</ul>

@await Html.PartialAsync("_LoginPartial")

</div>

</nav>

<div class="container body-content">

@RenderBody()

<hr />

<footer>

<p>© @DateTime.Now.Year - TNPK</p>

</footer>

</div>

<environment names="Development">

<script src="~/lib/jquery-ui/jquery-ui.min.js"></script>

<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>

<script src="~/lib/kendo-ui/js/jszip.min.js"></script>

<script src="~/lib/kendo-ui/js/kendo.all.min.js"></script>

<script src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"></script>

<script src="~/lib/kendo-ui/js/cultures/kendo.culture.ru-RU.min.js"></script>

<script src="~/lib/p-loading/dist/js/p-loading.min.js"></script>

<script src="~/lib/clipboard/dist/clipboard.min.js"></script>

<script src="~/js/site.js" asp-append-version="true"></script>

</environment>

<environment names="Staging,Production">

<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"

asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"

asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"

crossorigin="anonymous"

integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">

</script>

<script src="~/lib/kendo-ui/js/jszip.min.js"></script>

<script src="~/lib/kendo-ui/js/kendo.all.min."></script>

<script src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"></script>

<script src="~/lib/kendo-ui/js/cultures/kendo.culture.ru-RU.min.js"></script>

<script src="~/lib/p-loading/dist/js/p-loading.min.js"></script>

<script src="~/lib/clipboard/dist/clipboard.min.js"></script>

<script src="~/js/site.min.js" asp-append-version="true"></script>

</environment>

<script>kendo.culture("ru-RU");</script>

@RenderSection("Scripts", required: false)

</body>

second

<body>

<environment names="Development">

<script src="~/lib/jquery/dist/jquery.js"></script>

</environment>

<environment names="Staging,Production">

<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.2.1.min.js"

asp-fallback-src="~/lib/jquery/dist/jquery.min.js"

asp-fallback-test="window.jQuery"

crossorigin="anonymous"

integrity="sha384-3ceskX3iaEnIogmQchP8opvBy3Mi7Ce34nWjpBIwVTHfGYWQS9jwHDVRnpKKHJg7">

</script>

</environment>

<environment names="Development">

<script src="~/lib/jquery-ui/jquery-ui.min.js"></script>

<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>

<script src="~/lib/kendo-ui/js/jszip.min.js"></script>

<script src="~/lib/kendo-ui/js/kendo.all.min.js"></script>

<script src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"></script>

<script src="~/lib/kendo-ui/js/cultures/kendo.culture.ru-RU.min.js"></script>

<script src="~/lib/p-loading/dist/js/p-loading.min.js"></script>

<script src="~/lib/clipboard/dist/clipboard.min.js"></script>

<script src="~/js/site.js" asp-append-version="true"></script>

</environment>

<environment names="Staging,Production">

<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/bootstrap.min.js"

asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"

asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"

crossorigin="anonymous"

integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa">

</script>

<script src="~/lib/kendo-ui/js/jszip.min.js"></script>

<script src="~/lib/kendo-ui/js/kendo.all.min."></script>

<script src="~/lib/kendo-ui/js/kendo.aspnetmvc.min.js"></script>

<script src="~/lib/kendo-ui/js/cultures/kendo.culture.ru-RU.min.js"></script>

<script src="~/lib/p-loading/dist/js/p-loading.min.js"></script>

<script src="~/lib/clipboard/dist/clipboard.min.js"></script>

<script src="~/js/site.min.js" asp-append-version="true"></script>

</environment>

<nav class="navbar navbar-inverse navbar-fixed-top">

<div class="container">

<div class="navbar-header">

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

<span class="sr-only">Toggle navigation</span>

<span class="icon-bar"></span>

</button>

<a asp-area="" asp-controller="Home" asp-action="Index" class="navbar-brand">TNPK</a>

</div>

<div class="navbar-collapse collapse">

<ul class="nav navbar-nav">

@if (SignInManager.IsSignedIn(User))

{

<li><a asp-area="" asp-controller="Codeword" asp-action="Index">Кодовые слова</a></li>

}

</ul>

@await Html.PartialAsync("_LoginPartial")

</div>

</nav>

<div class="container body-content">

@RenderBody()

<hr />

<footer>

</footer>

</div>

<script>kendo.culture("ru-RU");</script>

@RenderSection("Scripts", required: false)

</body>

3 Answers, 1 is accepted

answered on 15 May 2017, 06:20 AM

Hello Dima,

In this scenario, the issue occurs because of the rendering order.

This issue occurs when the scripts are loaded after the body is rendered, and the kendo object is still not available.

I can assume that in this scenario, the difference is that they are placed before and after:

@RenderBody()

The Kendo UI team has no full control where the scripts have to be placed, they just have to be loaded, before the widgets are rendered.

Regards,
Stefan
Telerik by Progress

Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.