Javascript

説明 [#cebfd1c1]

フォームにカレンダーを表示させたいけど、input type dateではIEとかでは表示されないので使えない場合、jqueryのdatepickerというライブラリ？を使用すれば、簡単にデザイン性が高くIEでも表示可能なカレンダーが作成できます。

使用方法 [#j0a73b03]

+http://jquery.com/download/からjqueryをダウンロード +あとは下記パスをソースに記述

 <script src="js/jquery-1.11.3.min.js"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>
 <link rel="stylesheet" href="js/jquery-ui.css" >
 <script>
 $(function() {
  $("#datepicker").datepicker( { minDate: '+7d'} );   <--７日後以降を指定させる場合yとかでも指定可能
  $("#datepicker").datepicker("option", "buttonImageOnly", true);
 });
 </script>

フォームで使用する箇所 [#qfa8c37a]

 <input type="text" id="datepicker" name="hogehoge">

参考サイト：http://www.webdesign-fan.com/jquery-ui-datepicker