Telerik Forums / UI for ASP.NET AJAX Forum / General Discussions /

$

Telerik UI for ASP.NET AJAX
Resources Buy Try

10 posts, 0 answers

Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 28 Feb 2019 Link to this post

This may or may not be a Telerik issue (I don't "think" it is), but thought I'd post here just in case anyone had some insight. I'm getting this error when I add some JavaScript to my ASPX or even just a simple HTML page (using IE11):

Error: https://drive.google.com/open?id=1Rb_dXueUJuqJWdQ_IKg69LV4iuDJRFrl

The code is very simple HTML:

<!DOCTYPE html>

<html>

<head>

    <title></title>

    <meta charset="utf-8" />

</head>

<body>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

    <script type="text/javascript">

            $(document).ready(console.log("Test"));

    </script>

</body>

</html>
Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 28 Feb 2019 Link to this post

Ooops, really which I could edit my own thread ... the topic should be "$ undefined".

Thanks, Rob.
Vessy
Admin

2193 posts

Posted 01 Mar 2019 Link to this post

Hi Rob,

Our controls are shipped with an embedded version of jQuery, the "$" alias in which is replaced with "$telerik.$". In order to use external jQuery (and the "$" alias, respectively) you have to follow the steps from this article:
https://docs.telerik.com/devtools/aspnet-ajax/controls/scriptmanager/disabling-the-embedded-jquery

Regards,
Vessy
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.
Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 01 Mar 2019 in reply to Vessy Link to this post

Hi Vessy,

Thank you for the response ... this sounds foreboding but I'll give it a try. The link you provide has another link to the "required" version of JQuery that Telerik controls use ... but that link is broken see here: https://docs.telerik.com/devtools/aspnet-ajax/controls/scriptmanager/%7B%slug%20introduction/radcontrols-for-asp.net-ajax-fundamentals/using-jquery/using-jquery%20%%7D#jquery-version-history-in-telerik-ui-controls

Do you have a corrected link or can provide the correct <script src= ... for the JQuery version?

Cheers, Rob.
Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 01 Mar 2019 Link to this post

UPDATE:

I disabled embedded JQuery in my Web.Config and added external JQuery script references but now I get $telerik undefined and the following error:

https://drive.google.com/open?id=1R3g3Kb2cBTTjwV8JyGxg8gdOBtZPLx12

My Web Config:

<appSettings>

  <add key="BindGridInvisibleColumns" value="true" />

  <add key="CSApiKey" value="" />

  <add key="KeepOriginalOrderOfScriptDescriptorsDuringAjax" value="true" />

  <add key="Telerik.AsyncUpload.ConfigurationEncryptionKey" value="" />

  <add key="Telerik.Upload.ConfigurationHashKey" value="" />

  <add key="Telerik.AsyncUpload.TemporaryFolder" value="~/tempUploads" />

  <add key="Telerik.EnableEmbeddedBaseStylesheet" value="true" />

  <add key="Telerik.EnableEmbeddedScripts" value="true" />

  <add key="Telerik.EnableEmbeddedSkins" value="true" />

  <add key="Telerik.ScriptManager.EnableEmbeddedjQuery" value="false" />

  <add key="Telerik.Web.UI.RenderMode" value="lightweight" />

  <add key="Telerik.Web.CaptchaDenyAudioHandler" value="true" />

  <add key="Telerik.Web.DisableAsyncUploadHandler" value="true" />

  <add key="Telerik.Web.DisableCloudUploadHandler" value="true" />

  <add key="Telerik.Web.UI.DialogParametersEncryptionKey" value="" />

  <add key="Telerik.Web.UI.ScriptFolder" value="~/MyScripts/" />

  <add key="Telerik.Web.UI.ScriptFolders" value="~/MyScripts/; ~/MoreScripts/" />

  <add key="Telerik.Web.UI.StyleSheetFolder" value="~/App_Themes/" />

  <add key="Telerik.Web.UI.StyleSheetFolders" value="~/App_Themes/; ~/MyStyleSheets/" />

  <add key="UseGridNativeEditorsInMobileMode" value="true" />

  <add key="Telerik.Skin" value="Web20" />

  <add key="Telerik.ScriptManager.TelerikCdn" value="Disabled" />

  <add key="Telerik.StyleSheetManager.TelerikCdn" value="Disabled" />

</appSettings>

My ASPX page:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="MIOnline.aspx.vb" Inherits="DC.Web.MIOnline" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<link rel="stylesheet" runat="server" media="screen" href="DCStyles.css" />

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>MI</title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <script type="text/javascript">

            $(document).ready(console.log("Test"));

    </script>

</head>

<body>

    <form id="frmMI" runat="server">

        

        <telerik:RadScriptManager ID="rsmMI" runat="server" EnableHandlerDetection="false" EnableScriptCombine="false" EnableEmbeddedjQuery="false">

            <Scripts>

               <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js"></asp:ScriptReference>

               <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

               <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

           </Scripts>

        </telerik:RadScriptManager>

        <telerik:RadSkinManager ID="rskmMI" runat="server" Skin="Web20"></telerik:RadSkinManager>

        <telerik:RadInputManager ID="rimMI" runat="server"></telerik:RadInputManager>

        <telerik:RadWindowManager ID="rwmMI" runat="server"></telerik:RadWindowManager>

Also now getting the $Telerik undefined error ... any suggestions?

Cheers, Rob.
Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 01 Mar 2019 Link to this post

Also get this error:

https://drive.google.com/open?id=1p-bxhAlJRXPu7a5sbth8b8JjA7r0GmMK

With Telerik embedded disabled.

Cheers, Rob.
Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 01 Mar 2019 Link to this post

I reverted my changes back and now I'm still getting $Telerik ... unable to get back to a state that was working (without my other JavaScript). Any suggestions?

Cheers, Rob.
Vessy
Admin

2193 posts
Posted 06 Mar 2019 Link to this post

Hi Rob,

The proper link to the supported jQuery version of our controls is as follows:
https://docs.telerik.com/devtools/aspnet-ajax/general-information/using-jquery/using-jquery#jquery-version-history-in-telerik-ui-controls

Please note, that the controls' scripts must be loaded in exactly the same order like given in the pointed help article in order to work properly:

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnableEmbeddedjQuery="false">

    <Scripts>

       <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

       <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

       <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

    </Scripts>

</telerik:RadScriptManager>

For convenience, I am attaching a sample project containing two pages - one using the embedded and one - using the external jQuery, so you can examine them at your end.

Regards,
Vessy
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.

Telerik-jQuery.zip
Rob Ainscough

262 posts

Member since:
Jan 2010

Posted 06 Mar 2019 in reply to Vessy Link to this post

Thanks for the correct link Vessy, I was able to solve this problem in two ways:

1. Moved my JavaScript declaration down below Telerik definitions and outside the forms tag.

2. Per you comment, moved this reference "<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />" below.

Cheers, Rob.
Vessy
Admin

2193 posts

Posted 07 Mar 2019 Link to this post

Hi,

Thank you for the update, Rob - I am glad everything is working properly now. Just as a comment to the steps you have followed - make sure that the scripts remain inside the form tag, placing the to the end of the page, just before the closing </form> tag should suffice.

Regards,
Vessy
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.

$

Rob Ainscough

Rob Ainscough

Vessy

Rob Ainscough

Rob Ainscough

Rob Ainscough

Rob Ainscough

Vessy

Rob Ainscough

Vessy