Chase Florell
Chase Florell

Reputation: 47367

Yet Another "Object doesn't support this property or method" - jQuery

I just switched my App to run on MVC3 and the Razor view engine, and now I'm getting a JavaScript error. The thing is, nothing has changed on the JavaScript side of things... it worked before.

Here's the code

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
    var json_region = [{"value":365,"label":"Calgary"},{"value":368,"label":"Canmore"},{"value":393,"label":"Edmonton"}]
    $(function() {
        $('#UserRegion').autocomplete({
            source: json_region,
            selectFirst: true,
            select: function( event, ui ) {
                $('#RegionID').val( ui.item.value );
                $('#UserRegion').val( ui.item.label );
                return false;
            }
        });
    });
</script>

<script type="text/javascript" src="/Extras/urbannow.js/1"></script>
<script src="/Assets/Scripts/jquery.ui.autocomplete.selectfirst.js" type="text/javascript"></script>
<script src="/Assets/Scripts/wmd.js" type="text/javascript"></script>
<script src="/Assets/Scripts/showdown.js" type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script src="/Assets/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>

And this is erroring

$('#UserRegion').autocomplete({

The console says

SCRIPT438: Object doesn't support this property or method

And I just can't figure this one out.

Upvotes: 2

Views: 54672

Answers (4)

Alexey Semenko
Alexey Semenko

Reputation: 11

Duplicate jQuery declaration, check View Source of page

Upvotes: 0

RPM1984
RPM1984

Reputation: 73102

You're including jQuery twice.

Upvotes: 18

Elijan
Elijan

Reputation: 1416

load this BEFORE you custom script call

<script src="/Assets/Scripts/jquery.ui.autocomplete.selectfirst.js" type="text/javascript"></script>

or at very best custom code should be after all your JavaScript files. so , your code should look like something like this

 <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="/Extras/urbannow.js/1"></script>
    <script src="/Assets/Scripts/jquery.ui.autocomplete.selectfirst.js" type="text/javascript"></script>
    <script src="/Assets/Scripts/wmd.js" type="text/javascript"></script>
    <script src="/Assets/Scripts/showdown.js" type="text/javascript"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
    <script src="/Assets/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>

  <script type="text/javascript">
    var json_region = [{"value":365,"label":"Calgary"},{"value":368,"label":"Canmore"},{"value":393,"label":"Edmonton"}];
    $(function() {
        $('#UserRegion').autocomplete({
            source: json_region,
            selectFirst: true,
            select: function( event, ui ) {
                $('#RegionID').val( ui.item.value );
                $('#UserRegion').val( ui.item.label );
                return false;
            }
        });
    });
</script>

Upvotes: 1

Hamish
Hamish

Reputation: 23316

You're calling .autocomplete immediately after including the base jQuery library - which does not include the autocomplete plugin. Fix the order of your script references and make sure the autocomplete plugin is included before you try to use it.

Upvotes: 3

Related Questions