Jsヘルパーを使用してAjax更新

cakephp

更新処理でページ遷移を伴う場合、ページ全体をレスポンスするのに対して、Ajax処理ではページの一部のレスポンスが可能となるためサーバからの通信量を抑えることが可能となります。デモ

head

<?php 
// jQuery
echo $this->Html->script( 'jquery.min.js', array( 'inline' => 'false'));
// Jsヘルパーが生成するJSを出力させる
echo $this->Js->writeBuffer( array( 'inline' => 'true'));
?>

ビュー (Views)

// App/Views/Ajaxs/js_submit_form.ctp
<?php
echo $this->Form->create( 'Testtable', array( 'type'=>'post'));
echo $this->Form->text( 'data');
echo $this->Js->submit( 'Update', array(
    'before'  => $this->Js->get( '#sending-js-submit')->effect( 'fadeIn'),  // => beforeSend (Local Event)
    'success' => $this->Js->get( '#sending-js-submit')->effect( 'fadeOut'), // => success (Local Event)
//  'error' =>                       // => error (Local Event)
//  'complete' =>                    // => complete (Local Event)
    'url' => '/js_submit',           // Ajax処理で呼び出すURL(controller/action)
    'update' => '#result-js-submit', // ajax更新の結果を出力する要素
)); 
echo $this->Form->end();
?>
<div id="sending-js-submit">updaing...</div>
<div id="result-js-submit"></div>

beforeSend (Local Event)
AJAXリクエストが送信される前に呼び出されます。必要であれば、XMLHttpRequestオブジェクトを操作して追加のheaderを付与してやるなどの処理が行えます。
success (Local Event)
通信が成功した際に呼び出されます。サーバエラーやデータエラーが発生した場合には呼ばれません。
error (Local Event)
通信が失敗した際に呼び出されます。successとerrorが同じ通信で同時に呼ばれることは、決してありません。
complete (Local Event)
通信が完了した際に、成功/失敗にかかわらず呼び出されるものです。よしんば通信が非同期であっても、この関数は実行されます。
Ajax Events

コントローラ (Controllers)

// App/Controllers/AjaxsController.php
<?php
class AjaxsController extends AppController {
    var $name = 'Ajaxs';
    var $uses = array( 'Testtable');
    var $helpers = array( 'Js');
    var $components = array( 'RequestHandler');

    function js_submit_form(){}

    function js_submit(){
        // Ajax or not
//      if (!$this->RequestHandler->isAjax()){  // 非推奨
        if (!$this->request->is('ajax')){
            $this->redirect( '/js_submit_form');
        }
        // save OK
        if ($this->Testtable->save($this->data)) {
            $this->render( '/Elements/Ajaxs/ajaxupdated','ajax');
        // save NG
        } else {
            $this->set('valerror', $this->Testtable->validationErrors);
            $this->render( '/Elements/Ajaxs/ajaxupdated','ajax');
        }
    }
}
?>

$this->request->is('ajax')でリクエストがAjaxかどうかを判定します。urlに'js_submit'と手入力してアクセスした場合は、'js_submit_form'へリダイレクトされます。Inspecting the request
** コントローラ内でdataに値を入れたときに"Indirect modification of overloaded property"と怒られた場合は、このへんを参照して下さい。

エレメント (Ajax処理の結果を返す)

// App/Views/Elements/Ajaxs/ajaxupdated.ctp
<?php
if (!empty( $valerror['data'])){
    for($i=0; $i<count( $valerror['data']); $i++){
        echo $valerror['data'][$i];
    }
} else {
    echo h( $this->data['Testtable']['data']);
}
** 1.3では、1つのフィールドに対して[Model]->validationErrorsに格納されるエラーメッセージは、1つのルールだけでしたが、バリデーションエラーになった全てのメッセージを返してくれるようです。配列になっています。
バリデーションエラーメッセージの取得

モデル (Models)

// App/Models/Testtable.php
<?php
class Testtable extends AppModel {
    var $name = 'Testtable';
    var $useTable = 'testtables';
    var $validate = array(
        'data' => array(
            'maxlength' => array( 
                'rule' => array( 'maxlength',255),
                'message' => 'text is too long'
            ),
            'notempty' => array(
                'rule' => array( 'notempty'),
                'message' => 'Enter text'
            ),
        ),
    );
}
?>
  • このエントリーをはてなブックマークに追加

関連記事

cakephp

RSSフィードの取得

コンロトーラ public function getrssfeed() { try { $newsItems = $this->Rss->read( 'http://

cakephp

ネストしたリストを出力「nestedList」

DBやJSONからデータを取得して、そのデータをもとにメニュー表示などネストしたリストを出力させたい場合に「nestedList」が便利です。 ヘルパーに渡すデータは連想配列である必要があります。(

cakephp

(メール・URL・電話・郵便・IP) データ バリデーション

今回は、プロフィール情報に使用されるデータに絞ったバリデーションルールです。 バリデーションルール 以下の5つのバリデーションルールがコアに用意されています。 email メールアドレス

cakephp

数値系バリデーション

CakePHP 2になっていくつか数値用バリデーションルールが追加されています。 数値用 (コア)バリデーション decimal - 十進数であること numeric - 数値であること

no image

radioボタンを実装

Radioボタンの実装は、セレクトボックスとほぼ同じです。 個人的にはラジオボタンをすすんで使用することは少ないのですが、2択くらいの選択肢であれば非常に便利ですよね。 今回は、その実装方法 デモ

cakephp

Blowfishを使用してハッシュ化する

使用方法 Blowfishを採用してハッシュ化を行う場合、Securityクラスのhashメソッドを呼び出します。第2引数に'blowfish'を指定し、第3引数を指定しないもしくはfalseにしま

cakephp

パス定数と変更方法やURLの取得

CakePHPは基本的にはディレクトリそのまま配置することで構築が可能ではありますが、設定パスを変更することでセキュリティに考慮した構成にすることや運用性をもたせたものにすることが可能になります。

no image

HttpSocketを使用してリクエスト送信

CakePHPには、Webサービスへのリクエスト送信のためのHttpSocketクラスが用意されています。 HttpSocket get HTTP GETリクエストを発行します。デモ H

cakephp

入力文字列の長さ(文字数)をバリデーション

CakePHP 2には、コアバリデーションに文字列の長さを検証する関数が用意されています。 文字列長(コア)バリデーション minLength - 最小文字数以上であること maxLengt

cakephp

アップロードファイルのバリデーションルール

CakePHP 2.2や2.3になってファイルアップロードに対するルールがコアバリデーションに追加されているようで、まとめてみました。 コアバリデーション 関連しそうなルールは以下の4つの

Comment

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

PAGE TOP ↑