cakephpのbakeで日付を選択するのは、デフォルトで年・月・日をそれぞれドロップダウンより選択になっています。

これでも選択しづらいわけではありませんが、いまいち間違えた時に選択しなおすのが面倒な感じがします。

そこで、カレンダーから日付を選択しそのデータを登録できるようにしてみました。

使用環境：

・cakephp 1.3

・jQuery（jquery-1.3.2.min.js）

・datepicker(これは以下の記述でダウンロードするもの。)

datepickerの設定：

１．jQueryをhttp://jquery.com/からダウンロードしてください。

2．ひとまず以下のサイトに紹介されてあるとおりに諸々のファイルをダウンロードしてください。

http://bakery.cakephp.org/articles/view/transparent-datepicker-with-jquery

このサイトでは基本的にファイルを入れる場所まで記載されています。

＊注意！！！

『５．Add .js and .css in templates, maybe in $CAKE_PROJECT/app/views/layouts/default.ctp』

では、ソースの<div id="content">内に貼り付けてください。

使い方：

設定で紹介したページの下に書いてあることの他に、以下のリンクの『Usage』を見てください。

http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/

ここの<!-- jQuery -->から<script type="text/javascript" src="/scripts/jquery.datePicker.js"></script>をコピーし、

app/views/layouts/default.ctpの</title>以下に貼り付けてください。

＊カレンダーからの日付選択方法を細かく調整したい場合は、『Usage』を見たサイトの『Demos』の項目を見て、

自分に合いそうなものを見ながら追加設定してください。

これで英語の苦手な初心者でもおおよそできると思います。

関連する様々な参考サイトがありますが、詳細はソースのみに記述、という形も少なくなかったですね。

<追記>

この場合だと、デフォルトのドロップダウンは消えずにカレンダーで選択した値がドロップダウンの場所にそれぞれ入ります。

完全にデフォルトのドロップダウンを使わずにカレンダのみで日付の値を選択したい場合には、『jQuery UI』を使うようです。

『jQuery UI』はcakephp 1.3から使えるようになっており、よりヘルパーの種類が豊富になっています。