[Solved] ScriptRegistrar() and jQuery reference issue

[Hardy Wang]

Hi all,

I followed instruction from Telerik MVC extension that I register all scripts at the bottom of my master page by calling <% Html.Telerik().ScriptRegistrar(); %>, it works fines with all Telerik controls.

But meanwhile I also have my customized code to leverage jquery library, in content page I may have something like:
<script type="text/javascript">
    $(document).ready(function () {
        alert('document ready');
        // ....
    });
</script>

When I run my page, browser just complains that $ is not defined, the reason is simple: because the library reference <script type="text/javascript" src="/Scripts/2010.3.1318/jquery-1.4.4.min.js"></script> (rendered by <% Html.Telerik().ScriptRegistrar(); %>) appears at bottom of page (in master page), it is even after my script is defined.

What shall be the proper solution I still need to utilize jquery library to do something else, but I should not break script registration for Telerik controls?

Thanks

Hardy

[Hardy Wang]

One solution I found is that I added another content place holder after like below:

<% Html.Telerik().ScriptRegistrar().Render(); %>
<asp:ContentPlaceHolder ID="ViewScriptArea" runat="server" />

In my view page, I dump all client script into that place holder.

Not sure is it the recommneded approach by Telerik?

[gregor]

Hardy try this just before the end of master page or layout if razor:-

@(Html.Telerik().ScriptRegistrar().jQuery(

 

false))</body>

 

 

</

 

 

html>

 

and then youll have to add a script reference manually to jquery like so:-

<

 

 

script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>

Cheers
Gregor

 

[Bob]

I am still using the original Telerik MVC controls - they have a few things not in Kendo UI just yet.

I ran into the same problem with my JavaScript code being injected way before jQuery was loaded yet and error occured.
The trick is to use the ScriptRegistrar itself to invoke your code later.

I had a content page that created an Telerik MVC window. I wanted to use some client-side coding to center the Window.

At the bottom of my <content> block i put the following code:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 

        ...other markup including code that creates the Window control

    <% Html.Telerik().ScriptRegistrar().OnDocumentReady(() =>
        {%>
             var myWindow = jQuery("#FinanceWindow").data("tWindow");
             myWindow.center();
     <% });
        %>
 </asp:Content>

The ScriptRegistrar will now handle generating your code when it is the proper time and the error
is eliminated. If you look (using the F12 key in IE) at the page that is generated, now your
little block of script appears after jQuery is included and other code is run.