CakePHPでDatepickerの続き

CakePHPでjQueryのDatePickerを使う - yokkongの日記
先日の記事の続き。

とりあえずDatepickerヘルパーを作成して日付のカレンダー表示ができるようになったわけだけれども、一つのHTMLで複数のDatepickerヘルパーを使用した場合(例えば検索画面で日付の範囲指定など)、次のようなコードが出力されていた。

<link rel="stylesheet" type="text/css" href="/wendy/css/jquery-ui-1.10.3.custom.css" />
<link rel="stylesheet" type="text/css" href="/wendy/css/jquery-ui-1.10.3.custom.css" />
<script type="text/javascript" src="/wendy/js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="/wendy/js/jquery-ui-1.10.3.custom.js"></script>
<script type="text/javascript" src="/wendy/js/jquery.ui.datepicker-ja.js"></script>
<script type="text/javascript">
//<![CDATA[
jQuery(function($){$("#fromdate").datepicker({changeMonth: true,changeYear: true, yearRange:"1900:2023"});});
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
jQuery(function($){$("#todate").datepicker({changeMonth: true,changeYear: true, yearRange:"1900:2023"});});
//]]>
</script>

なぜかJavascriptは一つしか出ていないのにCSSは重複してしまう。
これでも問題無いのだろうが、とりあえずjQueryの読み込みはヘルパーでなくビュー側で行うようにした。

個別のビューに書くかレイアウトに書くかは使用頻度に寄るのかな？

個別のビューに書く場合は、

$this->Html->script('jquery-1.9.1', array('inline' => false));
$this->Html->script('jquery-ui-1.10.3.custom', array('inline' => false));
$this->Html->script('jquery.ui.datepicker-ja', array('inline' => false));
$this->Html->css('jquery-ui-1.10.3.custom', null, array('inline' => false));

レイアウトに書く場合は内に

echo $this->Html->script('jquery-1.9.1');
echo $this->Html->script('jquery-ui-1.10.3.custom');
echo $this->Html->script('jquery.ui.datepicker-ja');
echo $this->Html->css('jquery-ui-1.10.3.custom');

注意点としては、内の『echo $this->fetch('script');』よりも前に書くこと。

あとはdatepickerを参照している部分、例えば上記の場合だと

<script type="text/javascript">
//<![CDATA[
jQuery(function($){$("#fromdate").datepicker({changeMonth: true,changeYear: true, yearRange:"1900:2023"});});
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
jQuery(function($){$("#todate").datepicker({changeMonth: true,changeYear: true, yearRange:"1900:2023"});});
//]]>
</script>

この部分も

<script type="text/javascript">
//<![CDATA[
jQuery(function($){$("#fromdate, #todate").datepicker({changeMonth: true,changeYear: true, yearRange:"1900:2023"});});
//]]>
</script>

と書くこともできるのだが、それをCakePHPで実装できるのかどうかは分からないのでとりあえずはこのまま。