You've all been doing this for a bit, so please be patient...
Please follow along to see the logic…don't assume the initial error is my issue...
In MVC - I have a part view and wanted a datepicker on it.
So in my _PartialFormName.cshtml I had (from the sample) the following:
<input id="datepicker" />
<script>
$(function() {
$("#datepicker").kendoDatePicker();
});
</script>
This reports the error $ not defined.
That's because the render scripts call hasn't loaded the JQuery library at the bottom of the _Layout.cshtml page:
@Scripts.Render("~/bundles/scripts")
AND the script is not in a @section Script section that will be rendered by the call:
@RenderSection("scripts", required: false)
So, I put the script for datetimepicker it in the @section Script block...
BUT that's in the main MainPage.cshtml razor page, NOT the _PartialFormName.cshtml partial page…
So I need to know and collect all the control scripts of ALL partial views and put their scripts in the containing page?
******************************************
Now the best practice question...
Should I reference a child script named for that partial view containing all of the kendo scritps for that page?
How do we best contain kendo scripts? Is there a best practice?
Thanks
Thanks
R
Please follow along to see the logic…don't assume the initial error is my issue...
In MVC - I have a part view and wanted a datepicker on it.
So in my _PartialFormName.cshtml I had (from the sample) the following:
<input id="datepicker" />
<script>
$(function() {
$("#datepicker").kendoDatePicker();
});
</script>
This reports the error $ not defined.
That's because the render scripts call hasn't loaded the JQuery library at the bottom of the _Layout.cshtml page:
@Scripts.Render("~/bundles/scripts")
AND the script is not in a @section Script section that will be rendered by the call:
@RenderSection("scripts", required: false)
So, I put the script for datetimepicker it in the @section Script block...
BUT that's in the main MainPage.cshtml razor page, NOT the _PartialFormName.cshtml partial page…
So I need to know and collect all the control scripts of ALL partial views and put their scripts in the containing page?
******************************************
Now the best practice question...
Should I reference a child script named for that partial view containing all of the kendo scritps for that page?
How do we best contain kendo scripts? Is there a best practice?
Thanks
Thanks
R
1 Answer, 1 is accepted
0
Hello Robert,
I understand your desire to register script files at the bottom of the page, but this automatically brings up the requirement to reorganize all jQuery-dependent scripts.
You have two options:
1. Move jQuery to the page <head>
2. Move all jQuery-dependent scripts below the jQuery registration statement.
Generally, the "best practice" is (2), but I am not sure it is worth it in all scenarios or at all costs.
If you are using the Kendo UI MVC wrappers, you will need to defer the rendering of initialization scripts in order to control their placement:
http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/fundamentals#deferred-initialization
Before reorganizing the scripts, you can make a simple performance test - locate the generated HTML output of each Kendo UI widget wrapper. Replace the server widget declaration with the rendered HTML and <script> tag. Once you have this running OK, move the <script> tags below the jQuery file registration. Compare this setup with option (1) above, when you change nothing, but only move the script files to the <head>.
Another possible option, which may seem more complex at first glance, but more effective and less error-prone in the long run, is to wrap the Kendo UI initialization statements in custom functions, which will be registered to some global array and then executed in bulk after jQuery is registered. In this way you will not have to move any scripts or script files.
Regards,
Dimo
Telerik
I understand your desire to register script files at the bottom of the page, but this automatically brings up the requirement to reorganize all jQuery-dependent scripts.
You have two options:
1. Move jQuery to the page <head>
2. Move all jQuery-dependent scripts below the jQuery registration statement.
Generally, the "best practice" is (2), but I am not sure it is worth it in all scenarios or at all costs.
If you are using the Kendo UI MVC wrappers, you will need to defer the rendering of initialization scripts in order to control their placement:
http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/fundamentals#deferred-initialization
Before reorganizing the scripts, you can make a simple performance test - locate the generated HTML output of each Kendo UI widget wrapper. Replace the server widget declaration with the rendered HTML and <script> tag. Once you have this running OK, move the <script> tags below the jQuery file registration. Compare this setup with option (1) above, when you change nothing, but only move the script files to the <head>.
Another possible option, which may seem more complex at first glance, but more effective and less error-prone in the long run, is to wrap the Kendo UI initialization statements in custom functions, which will be registered to some global array and then executed in bulk after jQuery is registered. In this way you will not have to move any scripts or script files.
Regards,
Dimo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!