Uncaught TypeError: $(...).autocomplete is not a function in JQuery-UI

Question

The function autocomplete can not be recognized in my project even though I did store its ui-library at local disk and import it in script tags.

HTML code

  <link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
  <link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
  <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet" />
  <link href="~/Content/Chosen/chosen.min.css" rel="stylesheet" />
  <link href="~/Scripts/jquery-ui-1.10.2.css" rel="stylesheet" />

  <script src="~/Scripts/modernizr-2.6.2.js"></script>
  <script src="~/Scripts/jquery-ui-1.10.2.js"></script>
  <script src="~/Scripts/chosen.jquery.min.js"></script>
  <script src="~/Scripts/jquery-1.10.2.js"></script>
  <script src="~/Scripts/bootstrap.min.js"></script>

jquery code

$(document).ready(function() {
    $(document).bind('keypress', function(e) {
        if (e.keyCode == 13) {
            $('#defaultActionButton').trigger('click');
        }
    });

    $('#SearchString').keyup(function() {
        var value = $(this).val().toLowerCase();

        filter('#myTable tr', value);
    });

    function filter(idObject, srchText) {
        $(idObject).filter(function() {
            $(this).toggle($(this).text().toLowerCase().indexOf(srchText) > -1)
        });
    }

    $('#SearchString').autocomplete({
        source: '@Url.Action("SearchAutocomplete", "Student")'
    });
});

Full error

Uncaught ReferenceError: jQuery is not defined
    at jquery-ui-1.10.2.js:314
(anonymous) @ jquery-ui-1.10.2.js:314
chosen.jquery.min.js:2 Uncaught ReferenceError: jQuery is not defined
    at chosen.jquery.min.js:2
    at chosen.jquery.min.js:2
(anonymous) @ chosen.jquery.min.js:2
(anonymous) @ chosen.jquery.min.js:2
(index):144 Uncaught TypeError: $(...).autocomplete is not a function
    at HTMLDocument.<anonymous> ((index):144)
    at fire (jquery-1.10.2.js:3062)
    at Object.fireWith [as resolveWith] (jquery-1.10.2.js:3174)
    at Function.ready (jquery-1.10.2.js:447)
    at HTMLDocument.completed (jquery-1.10.2.js:118)

I do not really know what the root cause is. Please help if you have solution.

Answer 1

Put jquery.js file before jquery-ui.js file. Sequence matters.