やっと続きです。
まず目標とする画面イメージをサクッとつくってみました。
年を入力するテキストボックスと、月を選択するselect、その年月の表示アクションをキックするためのボタンを表示しました。これはダイレクトに書いているだけです。ソースはこんな感じ。
<div class=”row”>
<div class=”col-md-3″></div>
<div class=”col-md-6″>
<form method=”post” action=””>
<table>
<tr>
<td style=”width: 100px”>
<input name=”year” value=”” size=”6″ maxlength=”4″/>年
</td>
<td style=”width: 90px”>
<select name=”month” style=”height: 30px”>
<option value=”1″>1月</option>
<option value=”1″>2月</option>
<option value=”1″>3月</option>
<option value=”1″>4月</option>
<option value=”1″>5月</option>
<option value=”1″>6月</option>
<option value=”1″>7月</option>
<option value=”1″>8月</option>
<option value=”1″>9月</option>
<option value=”1″>１0月</option>
<option value=”1″>１1月</option>
<option value=”1″>１2月</option>
</select>
</td>
<td><button class=”btn btn-primary”>表示</button></td>
</tr>
</table>
<h3><?php echo $month;?></h3>
<label>Today:
<?php echo $today; ?>
</label>
<div class=”table-responsive”>
<table class=”table table-bordered text-center”>
<?php echo $cal_head;?>
<?php echo $cal_body;?>
</table>
</div>
</form>
</div>
<div class=”col-md-3″></div>
</div>
ベタで書いているだけです。
これを元に、要求仕様を満たすために変更を加えていきます。
まず、初期表示は、画面を表示した年月のカレンダーを表示したいです。つまり、年には今の年を、月はデフォルトで今の月が表示されるようにしたいです。
それらはコントローラ側で、セットして、表示するように直します。動的に作るにはコントローラに頑張ってもらうのが良く、ビューはあくまでコントローラから渡されたものを表示する、というスタンスでいることがMVCスタイルです。
一つ一ついきましょう。まず、年から。
ビューはこんな感じ。
<td style=”width: 100px”>
<input name=”year” value=”<?php echo $year;?>” size=”6″ maxlength=”4″/>年
</td>
テキストボックスのvalueを動的に表示できるようにスクリプトタグを入れます。で、これにコントローラから値を渡しましょう。
public function action_index()
{
//$data[“subnav”] = array(‘index’=> ‘active’ );
$data[“month”] = date(“F”);
$data[“today”] = date(“Y/m/d”);
$data[“year”] = date(“Y”);
$this->template->title = ‘祝！フロイデさん31期！’;
$this->template->content = View::forge(‘calendar/index’, $data);
$this->template->content->set_safe(‘cal_head’,$this->cal_header());
$this->template->content->set_safe(‘cal_body’,$this->cal_body());
}
これで初期表示が
当年を最初に表示するようになりました。簡単ですね！次は月です。ここはselectのoptionを動的に作ってやる必要があります。コントローラにそのためのfunctionを追加します。これが後々も役立つんです。。。はずです。
ここもまず、ビュー側のoptionをバコっと消してしまい、渡された値を表示するだけにします。
<td style=”width: 90px”>
<select name=”month” style=”height: 30px”>
<?php echo $options;?>
</select>
</td>
こんな感じ。ここにコントローラ側から表示するoptionタグを返してやります。
まず、月を受け取り、その月をselectedにしたoption群を作成するfunctionを作成します。
private function makeOptions($month){
$options = “”;
for($i = 1 ; $i <= 12 ; $i++){
if($i == $month){
$options .= ‘<option value=”‘ . $i . ‘” selected=”selected”>’ . $i . ‘月</option>’;
} else{
$options .= ‘<option value=”‘ . $i . ‘”>’ . $i . ‘月</option>’;
}
}
return $options;
}
action_indexでこのfunctionを呼び出します。引数には当月を渡します。
public function action_index()
{
//$data[“subnav”] = array(‘index’=> ‘active’ );
$data[“month”] = date(“F”);
$data[“today”] = date(“Y/m/d”);
$data[“year”] = date(“Y”);
$this->template->title = ‘祝！フロイデさん31期！’;
$this->template->content = View::forge(‘calendar/index’, $data);
$this->template->content->set_safe(‘cal_head’,$this->cal_header());
$this->template->content->set_safe(‘cal_body’,$this->cal_body());
$this->template->content->set_safe(‘options’,$this->makeOptions(date(“n”)));
}
追加した年と月はOKです。
さてカレンダーですが、これは、この入力された年と月で表示しているわけではありませんね。デフォルトで当年当月を表示しています。この部分を、追加した部品の値をとって表示するように修正しましょう。
private function cal_body()を引数を受け取るように変えます。
まず、action_indexから。
public function action_index()
{
//$data[“subnav”] = array(‘index’=> ‘active’ );
$data[“month”] = date(“F”);
$data[“today”] = date(“Y/m/d”);
$data[“year”] = date(“Y”);
$this->template->title = ‘祝！フロイデさん31期！’;
$this->template->content = View::forge(‘calendar/index’, $data);
$this->template->content->set_safe(‘cal_head’,$this->cal_header());
$this->template->content->set_safe(‘cal_body’,$this->cal_body(date(“Y”),date(“n”)));
$this->template->content->set_safe(‘options’,$this->makeOptions(date(“n”)));
}
cal_body()はこのように。
private function cal_body($year,$month){
$cal_body = “”;
$date = mktime(0,0,0,$month,1,$year);
for($i = 0 ; $i < date(“t”,$date); $i++){
$week_number = date(“w”,mktime(0,0,0,$month,$i+1,$year));
if($week_number == 0 && $i != 0){
$cal_body .= “<tr>”;
} else if($i == 0){
$cal_body .= $this->spacecell($week_number);
}
$cal_body .= “<td>” . ($i + 1) . “</td>”;
if($week_number == 6){
$cal_body .= “</tr>”;
}
if(($i + 1) == date(“t”)){
$cal_body .= $this->spacecell(6 – $week_number);
}
}
return $cal_body;
}
で、実行すると、
出来てるっぽいですが、何せ表示としては変わらないので、分かりませんね。。とりあえず進めちゃいますか。
いよいよ、表示ボタンアクションです。と！ここで大きなミスを発見。表示したボタンがただのボタンです。submitにしましょう。
<td><button type=”submit” class=”btn btn-primary”>表示</button></td>
こうですね。すみません。ここでひとつふたつ、考えどころがあります。まず、月はselectなので空白という状況は生まれませんのでrequiredチェック（入力必須チェック）をする必要がありませんが、年は空白にすることもできますし、年でない値も入力できちゃいます。従って入力チェックが必要です。
もうひとつ、このアクションに別functionで対応するか、action_indexを呼んじゃうか、という問題です。良し悪しなんですよねぇ。。今回は別のactionを作りますか。ね。その姿はaction_indexととても似ているものになります（なので、ひとつで書くこともひとつの案ではあるのですが）。
とりあえず、コントローラにactionを作ります。
public function action_putbutton(){
echo “putbutton call success.”;
}
で、ビューのほうのformのactionにセットします。
<form method=”post” action=”putbutton”>
ボタンを押してみます。
エラーにはなりますが、putbuttonアクションが呼ばれていることは分かりますね。URLがそのようになっています。
あとはこの中身を作っていけば完成です。たぶん。
ということで完成は、次回に。だって眠いんだもん。