indexビューの修正
indexビューの未完了タスクの表示までを,
app/
<?php echo $javascript->link('prototype') ?>
<?php echo $ajax->form('/tasks/add', 'post', array('update' => 'yet_tasks')) ?>
<p><?php echo $html->input('Task/content') ?>
<?php echo $html->submit('タスクを追加') ?></p>
</form>
<h2>未完了タスク</h2>
<div id="yet_tasks">
<?php echo $this->renderElement('yet_tasks_table') ?>
</div>
<h2>完了タスク</h2>
<table>
<tr>
<th>Id</th>
<th>タスク内容</th>
<th>状態</th>
<th>操作</th>
<th>作成日</th>
</tr>
<?php foreach ($done_tasks as $task) { ?>
<tr>
<td><?php echo h($task['Task']['id']) ?></td>
<td><?php echo h($task['Task']['content']) ?></td>
<td><?php echo h($task['Task']['status']) ?></td>
<td><?php echo $html->link('削除', '/tasks/del/' . $task['Task']['id'], null, '削除してもよろしいですか?') ?></td>
<td><?php echo h($task['Task']['created']) ?></td>
</tr>
<?php } ?>
</table>
1行目ではprototypeライブラリを読み込んでいます。先ほどapp/
<?php echo $javascript->link('prototype') ?>
3行目ではform要素の開始タグの表示がAJAXヘルパーによって行われるようになりました。
<?php echo $ajax->form('/tasks/add', 'post', array('update' => 'yet_tasks')) ?>
AJAXヘルパーの第1引数はデータ送信先のパス,
<div id="yet_tasks">
<?php echo $this->renderElement('yet_tasks_table') ?>
</div>
タスクの追加では未完了タスクが変更されるため,
$this->renderElement()とは
ビュー内で実行する$this->renderElement()メソッドは,
yet_tasks_tableエレメントとaddビューの作成
yet_
app/
<table>
<tr>
<th>Id</th>
<th>タスク内容</th>
<th>状態</th>
<th>操作</th>
<th>作成日</th>
</tr>
<?php foreach ($yet_tasks as $task) { ?>
<tr>
<td><?php echo h($task['Task']['id']) ?></td>
<td><?php echo h($task['Task']['content']) ?></td>
<td><?php echo h($task['Task']['status']) ?></td>
<td>
<?php echo $html->link('完了', '/tasks/done/' . $task['Task']['id'],
null, '完了してもよろしいですか?') ?>
<?php echo $html->link('編集', '/tasks/edit/' . $task['Task']['id']) ?>
<?php echo $html->link('削除', '/tasks/del/' . $task['Task']['id'],
null, '削除してもよろしいですか?') ?>
</td>
<td><?php echo h($task['Task']['created']) ?></td>
</tr>
<?php } ?>
</table>
addビューはapp/
app/
<?php echo $this->renderElement('yet_tasks_table') ?>
以上でタスク追加のAjax化が完了しました。なお,
修正後のアプリケーションにアクセスし,
また,
AJAXヘルパーについては,
次回予定は,