'Kendo is not defined' issue

4 Answers 9242 Views
Date/Time Pickers
Nallamani
Top achievements
Rank 1
Nallamani asked on 05 Apr 2017, 06:03 AM

Hi,

Am getting 'Kendo is not defined' error while using date picker MVC UI control.

Uncaught ReferenceError: kendo is not defined

 

Anubhav
Top achievements
Rank 1
Iron
commented on 24 Nov 2022, 04:08 AM | edited

in my case, i was using both Telerik and kendo dll. 

use  <%: Html.Telerik().ScriptRegistrar().jQuery(false) %>   before using kendo script .

Anton Mironov
Telerik team
commented on 25 Nov 2022, 12:32 PM

Hi Anubhav,

Could you please share if there is an error in your application?

Furthermore, it will be great if you can share the error message and the code implementation.

Looking forward to hearing back from you.


Kind Regards,
Anton Mironov

4 Answers, 1 is accepted

Sort by
1
Chris
Top achievements
Rank 1
answered on 26 Feb 2019, 01:34 AM

Included the following code in the head tag (moved from the body)  That fixed our issue:

    <environment include="Development">
        <script src="~/lib/jquery/dist/jquery.js"></script>
        <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.js"></script>
        <script type="text/javascript" asp-append-version="true" src="~/lib/kendo-ui/kendo.custom.min.js"></script>
    </environment>
    <environment exclude="Development">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=">
        </script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.bundle.min.js"
                asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"
                asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
                crossorigin="anonymous"
                integrity="sha256-E/V4cWE4qvAeO5MOhjtGtqDzPndRO1LBk8lJ/PR7CA4=">
        </script>

    </environment>

 

 

the CDN links never worked for us.  This is just the sample .net core project included with VS2017.  You have to modify it SUBSTANTIALLY to get Telerik for .net Core to actually work.

 

Alex Hajigeorgieva
Telerik team
commented on 27 Feb 2019, 12:36 PM

Hello, Chris,

Thank you for sharing with the Kendo UI Community.

The relevant article for the scripts and styles inclusion is available at:

https://docs.telerik.com/aspnet-core/getting-started/getting-started-copy-client-resources

For completeness, I will also include the article which demonstrates starting from scratch:

https://docs.telerik.com/aspnet-core/getting-started/getting-started

Finally, the easiest way is to use a template project with the VS Extensions:

https://docs.telerik.com/aspnet-core/getting-started/getting-started

I noticed that you mentioned that the CDN resources did not work for you. IF you are able to provide us with some more details, I would gladly investigate what may be the cause.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Ryan
Top achievements
Rank 1
commented on 25 Aug 2019, 02:21 PM

Same issue. It just doesn't work on Razor page 2.0. It only works on .Net Core MVC.
Tsvetomir
Telerik team
commented on 27 Aug 2019, 10:24 AM

Hi Ryan,

The Kendo UI is a client-side library which is able to work with any environment. In the current case, the ASP.NET Core wrappers are designed for the ASP.NET Core framework. While the widgets depend on the NuGet, it is a matter of choice of how you would add the client-side scripts and styles to the project. 

In case there are duplicate references to either jQuery or Kendo UI, unexpected behavior could be observed. 

I am attaching a sample project to my response which is built with Razor pages rather than MVC. Is it possible for you to modify it in order to replicate the faulty behavior and send it back to me? 

Thank you for your cooperation in advance.


Kind regards,
Tsvetomir
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Ryan
Top achievements
Rank 1
commented on 02 Sep 2019, 08:23 PM

Hi Tsvetomir,

Thanks for your sample. Will try this out and give you feedback!

Regards,

Ryan

Ryan
Top achievements
Rank 1
commented on 03 Sep 2019, 09:26 PM

Hi Tsvetomir,

Just wondering if you have razor page with api call sample? Probably just the onPostRead (fetch) will suffice. Sample rest api url: https://randomuser.me/api/?results=10.. Wanted to plot image and few fields like name and email on kendu grid.

Thanks in advance!

Ryan

Tsvetomir
Telerik team
commented on 05 Sep 2019, 12:17 PM

Hi Ryan,

Binding to a WebAPI would not be coupled to the Kendo UI Grid at all. It is only responsible for retrieving the data. The service layer should be implemented to the developer's preferences and conventions. 

Nevertheless, a live demo for binding to a WebAPI could be found here:

https://demos.telerik.com/aspnet-core/grid/webapi

It would be similar for the razor pages. Only the syntax should be adjusted.


Best regards,
Tsvetomir
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Stefan
Telerik team
answered on 06 Apr 2017, 10:53 AM
Hello Nallamani,

This issue indicates that the Kendo UI related scripts are not loaded correctly on the page. For example, if a culture file is loaded, it is using kendo, and the Kendo UI script file has to be loaded first.

Please check the following forum threads on a similar subject:

http://www.telerik.com/forums/uncaught-referenceerror-kendo-is-not-defined

http://stackoverflow.com/questions/31182638/uncaught-referenceerror-kendo-is-not-defined

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.
Chris
Top achievements
Rank 1
commented on 26 Feb 2019, 12:31 AM

So, no sample project or .net core starter project to use right?  Why not?  More incomplete documentation for .NET core.  You can't even provide a sample to get a basic project running??
0
Brian
Top achievements
Rank 1
answered on 11 Sep 2019, 09:55 PM

I had the same problem, and found the same solution, but you have to put all the pieces together first.  There is no 1 stop solution.

First, VS2019 16.2.4 .NET 4.7.03190, ASP.NET 2.2.0  I'm using Core, not MVC.

Create New Project -->ASP.NET Core Web Application-->TestTelerik01-->Create-->Web Application (not MVC) --> Create --> Done

Run the application, it is fine.

Following the instruction at https://docs.telerik.com/aspnet-core/getting-started/first-steps is all good.  The problem arises at Step 7 Client-Side resource.  They are not wrong, just not specific enough.  At step 7.3 it says "After jquery, copy and paste the script from the snippet."  Unfortunately, the jquery scripts are included in the Body and not the Head of the default app.  The solution is to move everything into the Head, including the kendo scripts, as Chris noted above.  NOTE: There is a link about including client side resources, (https://docs.telerik.com/aspnet-core/getting-started/installation/getting-started-copy-client-resources) and it clearly and emphatically shows everything goes into the Head  to make it work.  Step 7.3 is not emphatic about putting everything in the Head.

Once done, Date picker using HTML Helper comes right up.  Still got problems with tagHelper, but I'll work it out..  

Here is my Head section for anyone's amusement.  Hope this is helpful.

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - TestTelerik6</title>

    <environment include="Development">
        <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
        <script src="~/lib/jquery/dist/jquery.js"></script>
        <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.js"></script>
        <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.619/styles/kendo.bootstrap-v4.min.css" />
        <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.all.min.js"></script>
        <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.aspnetmvc.min.js"></script>
    </environment>
    <environment exclude="Development">
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
              asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
              asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute"
              crossorigin="anonymous"
              integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" />
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"
                asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
                asp-fallback-test="window.jQuery"
                crossorigin="anonymous"
                integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=">
        </script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"
                asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"
                asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal"
                crossorigin="anonymous"
                integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o">
        </script>
        <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.619/styles/kendo.bootstrap-v4.min.css" />
        <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.all.min.js"></script>
        <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.aspnetmvc.min.js"></script>
    </environment>
    <script src="~/js/site.js" asp-append-version="true"></script>
    <link rel="stylesheet" href="~/css/site.css" />
</head>

Tsvetomir
Telerik team
commented on 13 Sep 2019, 09:29 AM

Hi Brian,

Thank you for sharing the solution that has worked out for you. The getting started article was recently updated and all the things that you refer to are actually stated. Especially the fact that the jQuery is added by the Project template and it should be added to the head of the layout. As well as, that the Kendo UI scripts and styles have to be added in the head after the jQuery reference. 

If you have any suggestions on how to improve that article, you can share them here or commit the changes directly. Clicking on the "Improve this article" button, you would be redirected to the GitHub repository which holds the article.

As per the TagHelpers issue, can you provide additional details on what exactly is the behavior you experience? As you have just recently created the project, can you send it to me so that I can examine it locally?

Thank you for your cooperation in advance.


Best regards,
Tsvetomir
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Brian
Top achievements
Rank 1
commented on 13 Sep 2019, 11:29 AM

Hi Tsvetomir,

I've attached TestTelerik6.zip The HTMLhelper works, displaying a datepicker.  But the tagHelper does not.  It is pure Asp.Net Core, no MVC.  I'm a noob, so I'm sure my mistake is trivial.  I appreciate your assistance.

In your response, you mention the Virtual Classroom as the fastest way to get up to speed with Telerik.  However, it is not available during the Trial License period.  Consequently, the evaluation process goes slowly, and at times frustrating because of the lack of foundational knowledge.  These huge knowledge gaps make the evaluation process a very frustrating experience, and don't make it tough to justify the purchase of the DevCraft products.

I would suggest some kind of 3-5 hours of "kickstart" course to lay down a solid foundation.  For example, Microsoft's Contoso University example project, all done with Telerik components?  Call it Sofia University. :-)  This would provide small, but comprehensive example for evaluators to refer back to to.  It would also highlight the advantage of Telerik products over generic Asp.Net.

Thanks again.

 

Tsvetomir
Telerik team
commented on 17 Sep 2019, 09:25 AM

Hi Brian,

First of all, I would like to thank you for taking the time to share your thoughts and feedback on the getting started experience. 

Major effort has been put in improving the documentation of the ASP.NET Core in order to make the getting started process an easier journey. There are short videos in the bottom of the getting started articles. Our next steps in the continuous effort is to focus on the documentation for the TagHelpers. As well as, creating videos which would cover diverse scenarios with the Kendo UI widgets. 

As per the issue on hand, I did not find the attached zip file to your response. Can you confirm that you have sent it? 

In the meanwhile, I would recommend taking a look at the live demo below. Can you check out the console in the DevTools for any exceptions that might have been thrown?

https://demos.telerik.com/aspnet-core/datepicker/tag-helper

Looking forward to your reply.


Best regards,
Tsvetomir
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tigga
Top achievements
Rank 1
Iron
commented on 28 Jun 2021, 09:53 PM

In my project I gave up on BundleConfig.cs as well. Beware, the CDN upgrade tool does not look at every .cshtml page. A large multi-page application built over time with several developers means that it is on you to finish a solution search on the old module.
Tsvetomir
Telerik team
commented on 29 Jun 2021, 10:58 AM

Indeed, it is important for the CDN references to be added to a file that is shared and accessible to all pages that use Kendo UI. Such file is the Layout view that is merely always used. Otherwise, as you have stated, you should be adding the references per-view and/or test that every view works as expected.
0
Anubhav
Top achievements
Rank 1
Iron
answered on 24 Nov 2022, 04:08 AM | edited on 24 Nov 2022, 04:08 AM

in my case, i was using both Telerik and kendo dll. 

use  <%: Html.Telerik().ScriptRegistrar().jQuery(false) %>   before using kendo script .

Tags
Date/Time Pickers
Asked by
Nallamani
Top achievements
Rank 1
Answers by
Chris
Top achievements
Rank 1
Stefan
Telerik team
Brian
Top achievements
Rank 1
Anubhav
Top achievements
Rank 1
Iron
Share this question
or