Cakephp Ajax

4,601 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
4,601
On SlideShare
0
From Embeds
0
Number of Embeds
63
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Cakephp Ajax

  1. 1. CakePHP で Ajax ©  株式会社 一六社 入門編 発表者  MICK http://mick.blog16.jp/
  2. 2. ©  株式会社 一六社 はじめに <ul><li>CakePHP の Ajax ヘルパーを利用する </li></ul><ul><li>prototype.js を使う </li></ul><ul><li>JavaScript の記述がシンプルになる </li></ul><ul><li>1.1 系と 1.2 系の両方の話 </li></ul>◇ Prototype.js -> Sam   Stephenson 氏が提供するサイトから取得できる。 http://www.prototypejs.org/download
  3. 3. ©  株式会社 一六社 動作サンプル 実際のソース等を見る前に、 本日の宿題をみて頂きます。
  4. 4. ©  株式会社 一六社 データの流れと処理 index ( URL の登録) conversion   ( RSS フィードを検出⇒内容取得など) <ul><li>レスポンスを出力 </li></ul><ul><ul><li>記事の出力 </li></ul></ul><ul><ul><li>エラー出力 </li></ul></ul>① 非同期通信 ② 処理結果の返却
  5. 5. ©  株式会社 一六社 最初にすること <ul><li>Ajax ヘルパーを使うために </li></ul><ul><li>prototype.js を js ディレクトリへ配置 </li></ul><ul><li>使用するレイアウトで prototype.js を読み込む echo $javascript->link('prototype'); </li></ul><ul><li>Controller    var $helpers = array('Ajax‘); var $components = array('RequestHandler'); </li></ul>
  6. 6. ©  株式会社 一六社 書き方(アクション) <ul><li>今回は Ajax ヘルパーの form メソッドを利用して、画面遷移のない形で送信を行う。 </li></ul><ul><li>第1引数には、フォームの送信先(アクション) </li></ul><ul><li>第2引数には、フォームの送信方式を指定(未設定は post ) </li></ul><ul><li>第 3 引数はオプション。 </li></ul><ul><li>echo $ajax->form(&quot;conversion/&quot;, &quot;post&quot;, $options); </li></ul>
  7. 7. ©  株式会社 一六社 ヘルパーオプション <ul><li>Ajax ヘルパーの各メソッドでは、共通で利用するオプションがある。 </li></ul><ul><li>※ 今回使った設定したオプション </li></ul><ul><li>$options[‘update’] Ajax 操作の結果で更新したい DOM ID </li></ul><ul><li>$options[‘loading’] リモートドキュメントのデータが読み込まれている時に実行されるJSコード </li></ul><ul><li>$options[‘complete’] XmlHttpRequest が完了した時に呼ばれるコード </li></ul>※ その他のオプションはマニュアルを参照して下さい
  8. 8. ©  株式会社 一六社 コントローラ処理例 データを受け取ったコントローラでの処理例。 ・ ajax 呼ばれたかどうか if( $this->RequestHandler->isAjax() ){ $this->layout = “ajax”;// レイアウトの指定 //== 処理 ==// }else{ $this->redirect(‘index’); }
  9. 9. ©  株式会社 一六社 Ajax 通信時の処理例 処理結果を返却するとき view に値を渡さずコントローラで出力でも OK 。。 $this->AutoRender = false; echo “hoge”; exit;
  10. 10. ©  株式会社 一六社 実際のソースを見てみる 今までのことを踏まえてサンプルのソースを見てみる。
  11. 11. ©  株式会社 一六社 おしまい 参考 ・ CookBook ( http://book.cakephp.org/ ) ・ CakePHP ガイドブック

×