jQuery autocomplete not functioning

Question

I have spent many hours trying to figure out what is preventing the jQuery autocomplete function from working so would really appreciate any help. I am getting the following error in IE and a similar one in Chrome and Firefox:

JavaScript runtime error: Object doesn't support property or method 'autocomplete'

From what I have researched I understand that this is due to a js reference file but none of the solutions I have seen have worked. Here are the references to the js-ui and general js file:

<head>
   <meta charset="utf-8">
   <title>jQuery UI Autocomplete - Custom data and display</title>
   <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
   <script src="~/Scripts/jquery-1.10.2.js"></script>
   <script src="~/Scripts/jquery-ui-1.11.4.js"></script>
</head>

And here is where I implement it:

<script type="text/javascript">
        $(document).ready(function () {

            $("#school").autocomplete ({
                minLength: 2,
                source: schools,
                select: function (e, ui) {
                    e.target.value = ui.item.label;
                    $("#schoolValue").val(ui.item.value);
                    e.preventDefault();
                }
            });
</script>
<input id="school" class="register-field" placeholder="School" type="text" />

This has been driving me absolutely crazy so I again appreciate any help!

can u post sample of what "schools" is? do you see any errors on console? — Ziv Weissman
– Ziv Weissman, Commented Oct 12, 2015 at 19:16
what do you have in the variable "schools", array of string? — Rolwin Crasta
– Rolwin Crasta, Commented Oct 12, 2015 at 19:17
schools is an array of universities (label) with their database id's as the value. In the console in chrome it says "Uncaught TypeError: $(...).autocomplete is not a function" — Christian
– Christian, Commented Oct 12, 2015 at 19:19
Did you verify the path of the jquery, jquery js files <script src="~/Scripts/jquery-1.10.2.js"></script> <script src="~/Scripts/jquery-ui-1.11.4.js"></script> — Rolwin Crasta
– Rolwin Crasta, Commented Oct 12, 2015 at 19:21
Do you have any 404 Not Found console messages regarding jQuery UI? It sounds like jQuery UI is not being loaded properly, perhaps from an incorrect path... — War10ck
– War10ck, Commented Oct 12, 2015 at 19:26

War10ck · Accepted Answer · 2015-10-12 19:39:30Z

1

Try this:

<script type="text/javascript">
    $(function () {
        $("#school").autocomplete ({
            minLength: 2,
            source: schools,
            select: function (e, ui) {
                e.target.value = ui.item.label;
                $("#schoolValue").val(ui.item.value);
                e.preventDefault();
            }
        });
    });
</script>
<input id="school" class="register-field" placeholder="School" type="text" />

edited Oct 12, 2015 at 19:39

War10ck

12.5k7 gold badges46 silver badges56 bronze badges

answered Oct 12, 2015 at 19:36

Rolwin Crasta

4,3673 gold badges37 silver badges46 bronze badges

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

2 Comments

War10ck Over a year ago

@Christian It still sounds as though jQuery UI is not loading properly. Add alert($.ui.version); as the first statement in your document ready block. If the version number is not shown in the alert box, then jQuery UI is failing to load properly...

Rolwin Crasta Over a year ago

Refer : stackoverflow.com/questions/32116618/…

Collectives™ on Stack Overflow

jQuery autocomplete not functioning

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related