"not a function" error when referencing jquery library in ASP.NET MVC View with Telerik MVC Extensions

Question

In the script below, the .cluetip() function call results in "$(".tip").cluetip is not a function". I'm certain that the library is properly referenced b/c I can follow the link from the source. Also, the .click() function works fine. What am I missing? Many thanks!

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.cluetip.js")" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".tip").click(function () { alert('hi mom!'); }); // this works
        $(".tip").cluetip(); // results in $(".tip").cluetip is not a function
    });
</script>

Have you tried changing the position of jquery.cluetip.js higher, right after where you insert the jquery library? — Niklas
– Niklas, Commented Jun 2, 2011 at 12:11
@Niklas - thanks - good suggestion, but id didn't seem to help. This is the first time I've tried cluetip. I'll keep poking around at it. -- must — Brett
– Brett, Commented Jun 2, 2011 at 12:46
it really should work as you have in your example. Only thing that crossed my mind is that if some other javascript breaks it on the page. — Niklas
– Niklas, Commented Jun 2, 2011 at 12:55

Brett · Accepted Answer · 2011-06-02 16:29:38Z

1

There was a jQuery conflict. The Telerik MVC extension templates automatically add the following line to _layout.cshtml:

 @(Html.Telerik().ScriptRegistrar()
        .DefaultGroup(group => group.Combined(true).Compress(true))

At the time of this writing, this statement will add jQuery version 1.5.1. By default, jQuery is also included at the top of the _layout.cshtml file:

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

Hence, a conflict.

Solution

The way I solved this was to include jQuery version 1.5.1 in the <head> section:

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

And then suppress the jQuery output from Telerik:

@(Html.Telerik().ScriptRegistrar()
    .DefaultGroup(group => group.Combined(true).Compress(true))
    .jQuery(false))

edited Jun 2, 2011 at 16:29

answered Jun 2, 2011 at 16:10

Brett

8,7655 gold badges41 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

"not a function" error when referencing jquery library in ASP.NET MVC View with Telerik MVC Extensions

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related