JQuery .autocomplete не найден?

Я пытаюсь придать строке поиска функцию автозаполнения.

Вот моя панель поиска:

<form method="GET" action="{% url 'search_results' %}"
                  style="display: inline; background-color: transparent;" method="get">

                <div id="search_bar" class="row" style="margin-top: 0px; text-align: center;">

                    <input name="q" class="sb-pos" id="choices-text-preset-values"
                           type="text" placeholder="Aramak istediğiniz oyunu yazın!   " style="padding-left: 30px;"/>
                    <button type="submit" style="background-color: transparent; border: none;" class="sb-icon-pos">
                        <i class="fa fa-search" style="color: black; font-size: x-large;"></i>
                    </button>
                </div>
            </form>

Это мой скрипт:

    <script>
  $ ( function() {
    var availableTags = [
        {% for game in games %}
            "{{game.title}}",
        {% endfor %}
    ];
    $( "#choices-text-preset-values" ).autocomplete({
      source: availableTags
    });
  } );

</script>

В той части, которая у меня была: 

<script src="https://code.jquery.com/jquery-3.5.0.js"</script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Я получаю эту ошибку:

TypeError: $( "#choices-text-preset-values" ).autocomplete is not a function. (In '$( "#choices-text-preset-values" ).autocomplete({
      source: ['deneme','deneme2']
    })', '$( "#choices-text-preset-values" ).autocomplete' is undefined)

API jQuery (или вообще любой javascript API) может быть не найден по разным причинам.

Обычно проблема возникает из-за того, что код jQuery javascript не загружается в момент выполнения вашего скрипта. Это может быть вызвано различными причинами:

  • Адблокер мог заблокировать файл jQuery javascript
  • Файл jQuery javascript размещен на CDN / другом сервере, который находится в автономном режиме
  • Вы загрузили jQuery, но забыли включить jQuery UI (автозаполнение является частью jQuery UI!)
  • Ваш код был выполнен до того, как jQuery был загружен.
    Это может быть вызвано тем, что ваш код <script>$(document).ready(/*whatever*/);</script> расположен перед блоком <script src="/path/to/jquery.js"></script>, или же тем, что вы ошибочно сделали тег jquery script async. Поэтому убедитесь, что:
    1. тег jQuery script расположен перед вашим скриптом и
    2. он не помечен как async.
Вернуться на верх