jQueryのsortable 関数について（django2.0とbootstrapを使用）

Question

django2.0とbootstrap4を使用して、簡単なtagのリストを作成中です。
jQuery のsortable関数を使用して、リストの項目を入れ替えるコードを書きたいのですが、コンソールにエラーメッセージが表示され、実現できません。
私が書いたコードは以下の通りです(必要な部分だけ記載しています）。

base.html

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
{% block domready %}
{% endblock %}

list.html

  <div class="card-body">
            {% for tag in tags %}
                <ul class = "list-group order">
                    <li class = "list-group-item"><a href="{% url 'app:tag' tag.name %}">{{ tag.name }}</a></li>
                </ul>
            {% endfor %}
        </div>

{% block domready %}
<script>
    $(function() {
        $( '.order' ).sortable();
    });
</script>
{% endblock %}

コンソールのエラーメッセージ

jQuery.Deferred exception: $(...).sortable is not a function TypeError: $(...).sortable is not a function

現在、通常のjqueryのアニメーションを使用しないリスト表示は実現しています。
どなかた原因と解決策をご教示頂けませんでしょうか。何卒宜しくお願い致します。

補足
この質問の投稿後、以下のコードを追加することにより、タグの項目が動くようになりました。
しかし、順序を入れ替えるまでには至っていません。

base.html
<script src="code.jquery.com/jquery-1.12.4.js"></script>; 
<script src="code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

Answer 1

jQuery のsortable関数を使用して

標準APIにありませんので、プラグインを探して入れる必要があるのでは。

【jQuery API Documentation】
http://api.jquery.com/

---

追記：

                <ul class = "list-group order">
            {% for tag in tags %}
                    <li class = "list-group-item"><a href="{% url 'app:tag' tag.name %}">{{ tag.name }}</a></li>
            {% endfor %}
                </ul>

Comments

[kei344]

あ、質問文が書き換わった。

[superyamadaman]

ご指摘頂きまして誠に有難うございます。
すいません、勘違いをしていました。
自分が使っているのは標準ライブラリでは無く、jQuery UIというライブラリでした。
質問内容に”補足”という形で追記致しましたが、このCDNを読み込むと動くようにはなるのですが、順番を変更するところまでいきません。

[superyamadaman]

forタグで囲っているからでしょうか？

[kei344]

Djangoとかさわったことがありませんが、多分UL直下にLIがあるものが複数あって、LIがそれぞれ独立してしまっているからでしょう。

[kei344]

<ul><li></li></ul>
<ul><li></li></ul>
<ul><li></li></ul>
↓
<ul>
　<li></li>
　<li></li>
　<li></li>
</ul>

[superyamadaman]

す、すげえkei344さんあなた天才だ。
修正できました！有難うございます！