I am trying to switch our use of jquery over to that bundled with telerik since they are now the same version. However, I'm having a problem getting jquery-ui to work with it. I'm using jquery-ui to create a dialog, and it doesn't appear to work. Expanding the $telerik.$, I don't see a .dialog method on it.
I have the script references in our master page, as
then in a user control, I have
When I view the page source, I see the same order as this, the
is far above the jquery-ui lines.
Any thoughts
I have the script references in our master page, as
</head><body><form id="form1" runat="server"><telerik:RadScriptManager runat="server" ID="rsmMaster" EnablePartialRendering="true" LoadScriptsBeforeUI="true" > <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" /> </Scripts></telerik:RadScriptManager>then in a user control, I have
<link rel="stylesheet" type="text/css" href="/Styles/jquery-ui-1.9.1.min.css"/><script type="text/javascript" src="/Scripts/static/jquery-ui-1.9.1.min.js"></script>When I view the page source, I see the same order as this, the
<script src="/WebResource.axd?d=DuSlCKW6NVW_IvooK_ULRkGrkaQk8B9YO8dMFExK7Zd9u8awk2PNvZljNscyGZmt29aEjTONftL-RFMNd5YH_LVuLwJPS8p7Ny3IB93VcfM1&t=634970873020000000" type="text/javascript"></script>Any thoughts
4 Answers, 1 is accepted
0
Hi, Jay.
Even though we bundle jQuery with the RadControl for ASP.NET Ajax, we do not expose it globally to ensure it will not conflict with other versions.
To make it usable by jQuery UI, you just need to expose it e.g.:
Make sure you include this snippet before you include jQuery UI.
From that point on, jQuery UI will work with that object and extend it properly. Alternative is to go in the jQ ui scripts and edit the script so it explicitly uses $telerik.$.
Regards,
Ivan Zhekov
Telerik
Even though we bundle jQuery with the RadControl for ASP.NET Ajax, we do not expose it globally to ensure it will not conflict with other versions.
To make it usable by jQuery UI, you just need to expose it e.g.:
window.jQuery = window.$ = $telerik.$;Make sure you include this snippet before you include jQuery UI.
From that point on, jQuery UI will work with that object and extend it properly. Alternative is to go in the jQ ui scripts and edit the script so it explicitly uses $telerik.$.
Regards,
Ivan Zhekov
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Jay
Top achievements
Rank 2
Iron
Iron
Veteran
Rank 2
Iron
Iron
Veteran
answered on 21 Jun 2013, 01:58 PM
Okay, Ivan, thanks. Seems like that has got it working; I can invoke the jquery-ui stuff now. I'm still having another issue so I might be back but it seems like it's more on my end now. Thanks again!
0
Sharon
Top achievements
Rank 1
Rank 1
answered on 07 Jan 2016, 02:27 AM
Ivan,
I'm actually having a similar problem. I'm using JQueryUI on the same page with some telerik AJAX RADControls.
It literally blows up with JQueryUI's .dialog() is called.
I tried applying your fix above, (window.jQuery = window.$ = $telerik.$;), but it didn't work.
Unhandled exception at line 15422, column 2 in http://localhost:58268/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=radScriptManager_TSM&compress=1&_TSM_CombinedScripts_=;;Telerik.Web.UI,+Version=2015.3.930.45,+Culture=neutral,+PublicKeyToken=121fae78165ba3d4:en-US:cabc43da-04da-4243-ae6b-645a1423200c:ed16cbdc:24ee1bba:874f8ea2:c128760b:19620875:f46195d3:92fe8ea0:fa31b949:4877f69a:490a9d4e:bd8f85e4:cda80b3:2003d0b8:1e771326:88144a7a:2bef5fcc:e06b58fd:6d43f6d9:e330518b:c8618e41:1a73651d:333f8d94:c172ae1e:9cdfc6e7:e4f8f289:86526ba7:58366029:aa288e2d:258f1c72:b7778d6c:78b9daca
0x800a138f - JavaScript runtime error: Unable to get property 'disabled' of undefined or null reference
0
Hello Sharon,
You can configure the RadScriptManager to use an external jQuery. For example:
On a side note I suggest that you use the version of jQuery that is utilized by Telerik UI controls (i.e., version 1.11.1). More information on the matter is available here - http://docs.telerik.com/devtools/aspnet-ajax/general-information/using-jquery/using-jquery#jquery-version-history-in-telerik-ui-controls
Regards,
Danail Vasilev
Telerik
You can configure the RadScriptManager to use an external jQuery. For example:
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"> <script src="//code.jquery.com/jquery-1.11.1.js"></script> <script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager2" 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.jQueryExternal.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryPlugins.js" /> </Scripts> </telerik:RadScriptManager> <script type="text/javascript"> function openDialog() { $("#dialog").dialog(); } </script> <telerik:RadButton ID="RadButton1" runat="server" OnClientClicked="openDialog" AutoPostBack="false" Text="Open Dialog" /> <div id="dialog" title="Basic dialog"> <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p> </div> </form></body></html>On a side note I suggest that you use the version of jQuery that is utilized by Telerik UI controls (i.e., version 1.11.1). More information on the matter is available here - http://docs.telerik.com/devtools/aspnet-ajax/general-information/using-jquery/using-jquery#jquery-version-history-in-telerik-ui-controls
Regards,
Danail Vasilev
Telerik
Do you want to have your say when we set our development plans?
Do you want to know when a feature you care about is added or when a bug fixed?
Explore the
Telerik Feedback Portal
and vote to affect the priority of the items