ToDoアプリ(4/5)をトレースしてみたのバックアップ差分(No.3)

追加された行はこの色です。
削除された行はこの色です。
*Tasksコントローラの修正 [#j9e5b29c]
*indexビューの修正 [#h2386199]

（原典）http://gihyo.jp/dev/serial/01/cakephp/0008?page=2

Ajax化にあたって、index.ctpを書き換えます。

/cakephp/app/views/tasks/index.ctp
 <?php echo $javascript->link('prototype') ?>
 
 <?php echo $ajax->form('/add', 'post', array('update' => 'yet_tasks')) ?>
 <p><?php echo $form->input('Task.content', array('type'=>"text", 'label'=>"")) ?>
 <?php echo $form->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>





















閲覧総計：&counter();　　（本日：&counter(today);　　昨日：&counter(yesterday);)

CakePHPの入門者トレーニングとして、gihyo.jpサイトの「CakePHPで高速Webアプリ開発」
がすばらしい。しかし、このサンプル例題はCakePHP1.1で解説されている為、CakePHP1.2
では少し異なるコード表現になりそうな所がある。
サンプル例題「ToDoアプリ」をCakePHP1.2でトレースしてみた。　09/01/01

【目次】(項目をクリックすると、そこに飛べます)
#contents
~
*必要なJavaScriptライブラリの入手 [#e960bb33]

（原典）http://gihyo.jp/dev/serial/01/cakephp/0008

http://script.aculo.usからJavaScriptライブラリを入手

|&attachref(Ajaxツール導入１.JPG,zoom,300x300,button){新しい画像添付};|&attachref(Ajaxツール導入２.JPG,zoom,300x300,button){新しい画像添付};|
|１．Download pageをクリック|２．current versionのzipファイルをダウンロード|

９個のファイルを/cakephp/app/webroot/js/フォルダへ配置
1.prototype.js
2.builder.js
3.controls.js
4.dragdrop.js
5.effects.js
6.scriptaculous.js
7.slider.js
8.sound.js
9.unittest.js

（はまりポイント）ファイルが２つのフォルダにわかれているとは思わなかった。
prototype.jsの１つだけがlibフォルダに、他の8個のファイルはsrcフォルダ内にあった。


*Tasksコントローラの修正 [#j9e5b29c]

（原典）http://gihyo.jp/dev/serial/01/cakephp/0008?page=1

Ajax化にあたって、tasks_controller.phpのaddアクションを書き換えます。

/cakephp/app/controllers/tasks_controller.php
 <?php
 // app/controllers/tasks_controller.php
 class TasksController extends AppController { //AppControllerを継承
   var $name = 'Tasks'; //controller名を定義（頭が大文字を覚える）
   var $uses = array('Task'); //使用するmodel名を定義
   var $helpers = array( //利用ヘルパーの追加
     'Javascript',
     'Ajax',
   );
   
   function index() { //indexアクションの定義
     $this->set('yet_tasks', $this->Task->findAllByStatus('yet', null, 'Task.created ASC'));
     $this->set('done_tasks', $this->Task->findAllByStatus('done', null, 'Task.modified DESC'));
   }
   
   function add() {
     if (empty($this->data)) return; //モデルへの値が渡されてきているかチェック
     $this->Task->save($this->data, true, array('content', 'created', 'modified'));
     //DBへのレコード追加、saveの第3引数でホワイトリスト設定をした
     $this->set('yet_tasks', $this->Task->findAllByStatus('yet', null, 'Task.created ASC'));
     $this->layout = 'ajax';
   }
   
   function done($id) {
     if ($this->Task->findById($id)) {
       $this->Task->id = $id;
       $this->Task->save(array('status' => 'done'));
     }
     $this->redirect('/tasks');
   }
   function edit($id) {
     $task = $this->Task->findById($id);
     if (!$task) {
       $this->redirect('/tasks');
       return;
     }
     if (!empty($this->data)) {
       $task['Task']['content'] = $this->data['Task']['content'];
       $this->Task->save($task);
       $this->redirect(array('action'=>'index'));
     }
     $this->set('task', $task);
   }
   function del($id) {
     $this->Task->del($id);
     $this->redirect('/tasks');
   }
 
 }










●完了メッセージが表示されるので，メッセージ上のリンクを辿る
&ref(LH_cake_tasks保存完了メッセージ画面.JPG);
●タスクが追加された
&ref(LH_cake_tasksデータ入力確認画面.JPG);

#comment_nospam
#vote(参考になった[0],ふつう[0],参考にならなかった[0])
ToDoアプリ(4/5)をトレースしてみた のバックアップ差分(No.3)

ToDoアプリ(4/5)をトレースしてみたのバックアップ差分(No.3)
