DateTimePicker(j-Query)が正常表示されない問題を解決する

CakePHP

動作環境

jQuery 3.5.1

DateTimePicker(2020.12.1 時点の最新)

jQueryのプラグイン DateTimePickerを導入したんだが、ちゃんと設定してるはずなのに下記のような症状のまま全然改善しなかった。
やっと解決できたが、なかなか解決法を見つけられなかったので書き残す。
(表示されている画面はCakePHP3のものですが解決法は同じ)

解決方法は簡単でした。
DateTimePicker 公式サイトからダウンロードをすると、datetimepicker-master というフォルダを入手できる。
フォルダの第一階層は下記画像のようになっている。


ここにある jquery.datetimepicker.jsjquery.datetimepicker.css を使用したのだが、ここが間違っていた。
フォルダ build の中の jquery.datetimepicker.full.min.js を使用する必要があった。
(下画像はフォルダ build の内容)

CSSはここにある jquery.datetimepicker.min.css をしても良いが、DateTimePicker自体のCSSに変更を行う必要があるなら一階層上の jquery.datetimepicker.css を使用したほうが良いかも。
(今回は jquery.datetimepicker.css を使用した)

それだけで上画像のように症状が改善した。



タイトルとURLをコピーしました