BootStrapでモーダルウィンドウ上にDataPickerが表示されない

Author:

jqueryUIのdatepickerがなぜかmodalの外に出すと動くのにmodalの中に入れると表示されない。
コードはちゃんと正しいはずなのに、と色々ハマってしまった。

結果的にはz-indexの関係で表示されないっぽい。
<style>
.datepicker{z-index: 1151 !important; position: absolute;}
</style>
みたいにstyleを設定しないと駄目。

ただこれでもinlineで表示させようとするとサイズ計算がうまくいかないようでバグります。
height指定でもやるか、そもそも使わないほうがいいかも。

どれかを自作したほうが無難かなあ。
てかHTML5ならそもそもtype=”date”ってのがあるということに気づいた。
わざわざdatepickerとかtimepickerなんて使う必要ないですな。

しっかしbootstrapとjqueryUIは相性があまり良くないのかもしれないですね。
jqueryのdatepickerはonchangeが拾えるのにbootstrapのdatepickerってそもそもonchangeが拾えなかったりするし。

Share on Facebook
Pocket