0

最近、Dandelion datatables 1.1.1 をインストールしましたが、コア ライブラリに付属の jquery-ui を有効にする方法がわかりません。日付ピッカーを使用するにはそれが必要です。

私のプロジェクトでは、次のアーキテクチャが使用されています。

src
web 
|__ resources
    |__ css
    |__ js
|__ WEB_INF
    |__ views
        |__ ... html views
    |__ spring-servlet.xml

次の方法で spring-servlet にタンポポのリソースをロードします。

<mvc:resources mapping="/dandelion/**" location="classpath:/META-INF/resources/dandelion/"/>

js フォルダーには、datepicker-init.js があります。

$(document).ready(
  function () {
    $( "#datepicker" ).datepicker({
      changeMonth: true,
      changeYear: true
    });
  }
);

次に、このスクリプトをヘッダーにロードしようとします

<script th:src="@{/resources/js/datepicker-init.js}"></script>

そして、それを私のhtmlページで使用します:

<html xmlns:th="http://www.thymeleaf.org"
      xmlns:dt="http://www.thymeleaf.org/dandelion/datatables">
               ....
              <div id="filter_panel">
                    <form th:action="@{/requests}" th:object="${requestRegisterModel}"
                          method="post">
                        <input id="datepicker" type="text" />
                    </form>
              </div>

しかし、Uncaught ReferenceError: $ is not defined エラーがブラウザー コンソールに表示されます。jquery-ui が定義されていないためにこのエラーが発生することはわかっていますが、ヘッダーにスクリプトを読み込めません。

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>

この場合、jquery スクリプトが 2 回読み込まれるためです。ここで同様の問題を見つけましたが、アセットバンドルなしで jquery-ui をロードすることは可能だと思いましたが、その方法はまだわかりません。他のすべては問題なく動作します。

ブラウザ コンソール

4

1 に答える 1