ライブラリであるjQuery UIの組み込みはAccordionの組み込みのページを参照。
さらにDatepickerを日本語で扱いたいので、jquery.ui.datepicker-ja.jsを新たに追加して、このモジュールを参照するようにした。
Datepickerを使うためのソースコードは次のとおり
<?php if(isSet($_POST["inputflg"]) && $_POST["inputflg"] == 'inputon') : ?> <h2>送信されてきた日付</h2> <?php if(isSet($_POST["dayfrom"])) : ?> <p>●from日付は <?= $_POST["dayfrom"] ?> です</p> <?php else : ?> <p>from日付は空です</p> <?php endif; ?> <?php if(isSet($_POST["dayto"])) : ?> <p>●to日付は <?= $_POST["dayto"] ?> です</p> <?php else : ?> <p>to日付は空です</p> <?php endif; ?> <?php endif; ?> <!-- Datepickerを構成する要素(input) --> <div> <form action="" method="POST"> <label for="form">期間</label> <input id="form" name="dayfrom" type="text"> <label for="to">~</label> <input id="to" name="dayto" type="text"> <input type="hidden" name="inputflg" value="inputon"> <input type="submit" value="送信"> </form> </div> <script type="text/javascript"> // HTML文書の読み込みが完了してから実行 jQuery(function(){ // Datepickerウィジェットの生成 jQuery('#form').datepicker(jQuery.datepicker.regional['ja']); // 日本語の設定(1) jQuery.datepicker.setDefaults(jQuery.datepicker.regional['ja']); // 日本語の設定(2) jQuery('#to').datepicker(); }); </script>