JSON便利〜

AJAXの動きを作らなければ、ならなかったので、XMLJSONでどっちでも
できるように、アプリ側のインターフェースを作って。


いざ、Javascriptを書き始めると、JSONラブ!
XMLパースなんてやってられないですw


JSONAJAXやろう〜っと。心に決めました。
また、まとめてご紹介します。

入力チェック

フォームでの入力値の変換までできましたが、入力チェックをしなくては、
フォームの意味がありません。入力チェックを作ってみましょう。


今使っているフォームとは、別のチェック用のアクションを用意します。
同じアクションで行うと、最初にアクセスした時に、入力チェックがかかってしまうので、
入力チェックは別のアクションでおこないます。

アクションの作成

webapp/modules/test/form/check/Check.class.php に作成します。

<?php
class Test_Form_Check {
    var $name;
    var $email;
    
    function execute() {
        return 'success';
    }
}
?>

Test_Formアクションから、クラス名だけを変更しています。

maple.iniを作成します。

webapp/modules/test/form/check/maple.ini に作成します。

[Convert]
name.trim =
email.trim =
email.toHalf =

[Validate]
name.required = "1,名前を入力してください"
email.mail = "0,メールアドレスを正しく入力してください"

[View]
success = "test/form/result.html"
input = "test/form.html"

Varidateセクションに、チェック内容を記述します。
パラメータ名.チェック内容でキーを記述します。
値は、ストッパー.エラー文字列.引数を記述します。
ストッパーが1であり、その時点でエラーがあれば、その項目のそれ以下のチェックはおこないません。
ストッパーが0であれば、続けて他のチェックもおこないます。

name.required = "1,名前を入力してください"
name.maxlength = "0,名前は10バイト以内で入力してください,10"

上記の場合、requiredでエラーがあれば、maxlengthのチェックはおこないません。
requiredのストッパーが0であれば、両方ともチェックをおこないます。


Varidaterの種類は、下記URLを見てください。
http://kunit.jp/maple/wiki/index.php?reference%2Fjp#p8dd4622


Viewセクションには、input返却時のテンプレートを関連付けます。
入力チェックのエラー時は、アクションは実行されずに、フレームワークより、inputが返却されるので、
inputにテンプレートを関連付けておきます。

完了画面を作成します

webapp/templates/test/form/result.html に作成します。

<html>
<body>
form test success
Name:{$action.name}<br>
Email:{$action.email}<br>
</body>
</html>

入力画面に、エラーメッセージを表示させるために、入力画面を変更します。
webapp/templates/test/form/form.html を変更します。

<html>
<body>
form test
{errorList->getMessages assign="messages"}
{foreach from=$messages item=message}
<font color="#ff0000">{$message}</font><br>
{/foreach}
<form method="post">
Name:<input type="name" name="name" value="{$action.name}"><br>
Email:<input type="name" name="email" value="{$action.email}"><br>
<input type="submit" name="dispatch_test_form_check" value="Submit">
</form>
<hr>
Name:{$action.name}<br>
Email:{$action.email}<br>
</body>
</html>

すべてのエラーメッセージは、errorList->getMessagesより取り出すことができますので、
messages変数にassignし、messages変数より出力します。


ここまでで、設定はすべて完了です。動作を確認してみましょう。


実際に使う場合は、Test_Form_Checkクラスのexecute()メソッドに、データベースへの登録処理であるとか、
メールの送信処理を記述します。


さて、フォームを作ってみた感想はどうでしょうか?
今までの方法に比べて簡単になりました?

Converterを使った入力変換

次は、フォームの入力値を変換してみます。


簡単です。前回のmaple.iniに手を少し加えるだけです。
入力変換は、maple.iniのConvertセクションでおこないます。
下記を[View]セクションの前に追加してください。

[Convert]
name.trim =
email.trim =
email.toHalf =

それぞれのリクエストパラメータに変換ルールを付けてみました。

項目名 適用
trim 前後の空白を除去
toHalf 全角→半角に変換


他にも変換ルールはありますが、とりあえず上記2点を追加してみました。
動作を確認してみてください。

他の変換ルールに関しては、下記URLをご参照ください。
http://kunit.jp/maple/wiki/index.php?reference%2Fjp#wa8ba337

maple3.2.0b1リリース

mapleの3.2.0b1がリリースされました。

pearコマンドでのインストールに対応
ディレクトリ構成および設定ファイルの構成変更
mapleコマンドの導入
Simple Viewのクラス構成変更

インストール関係が、PEARコマンドでできるようになったので、
あれこれと説明する手間が省けますね。
SmartyPEARでインストールできるといいのにな〜・・・


FilterとValidatorのオリジナルが外に出せるようになったのが、うれしいです。
やっぱり、バージョンアップとかをケアすると、コアに含めたくはないですもんね。


あとは、mapleコマンドに慣れたいと思います。
未だにgeneratorになじめず、せっせとファイル作ってます。。。


便利になるのは、素敵ですね。

簡単なフォームの作成

いよいよお手軽なフォームの作成です。
今回は、1つの画面で入力と表示をおこないます。


4つのファイルで構成します。

  • エントリポイント
  • アクションクラス
  • maple.ini設定ファイル
  • テンプレートファイル

エントリポイント

htdocs/test/form.php を作成します。

<?php
error_reporting(E_ALL);
//error_reporting(0);

/**
 * MapleのBaseディレクトリの設定
 */
define('BASE_DIR', dirname(dirname(__FILE__)) . '/..');

/**
 * Debugフィルターを発動させるかどうかの設定
 */
define('DEBUG_MODE', 0);

/**
 * Mapleの設定ファイルの読込み
 */
require_once BASE_DIR . "/webapp/config/maple.inc.php";

/**
 * このアプリの独自設定
 */
define('ACTION_KEY',     'action');
define('CONFIG_FILE',    'maple.ini');
define('DEFAULT_ACTION', 'test_form');
define('LOG_LEVEL',      LEVEL_TRACE);

/**
 * フレームワーク起動
 */
$controller =& new Controller();
$controller->execute();
?>


DEFAULT_ACTION を test_form としました。
これで、アクションクラスの命名もすべてきまります。

アクションクラス

webapp/modules/test/form/Form.class.php を作成します。

<?php
class Test_Form {
    var $name;
    var $email;

    function execute() {
        return 'success';
    }
}
?>


属性には、フォームのエレメントのリクエストパラメータ名を登録します。
今回は、<input type="text" name="name"> <input type="text" name="email"> の2エレメントを作成します。

maple.ini設定ファイル

とりあえず、何もしないフォームを作成するだけなので、[View]だけです。

[View]
success = "test/form.html"

テンプレートファイル

フォームのテンプレートを作成します。
今回は、上部にフォーム、下部に表示部分を作成しています。

<html>
<body>
form test
<form method="post" action="test/form.php">
Name:<input type="name" name="name" value="{$action.name}"><br>
Email:<input type="name" name="email" value="{$action.email}"><br>
<input type="submit" name="dispatch_test_form" value="Submit">
</form>
<hr>
Name:{$action.name}<br>
Email:{$action.email}<br></body>
</html>


入力値は、アクションクラスの属性に自動的に、setterを通じてセットされるので。
{$action.name}で取り出すことができます。


簡単でしょ?
次は、Converterを使って入力変換をしてみます。

値を表示するには

しばらくは、mapleネタばっかりです。


さて、簡単な表示はできました。


次は、名前をテンプレートに表示するにはどうすればいいかです。
名前は、テンプレートには直接書きませんから、アクションクラスより受け取らないといけません。


mapleではどうやって書くかといいますと。
アクションクラスに属性を持たせ、そこに値をいれておきます。

<?php
class Test_Main {
    var $name;
    
    function execute() {
        $this->name = 'foo';
        
        return 'success';
    }
}

名前はfooとして、設定します。


そして、テンプレート側を変更します。

<html>
<body>
Hello World.<br>
Name:{$action.name}
</body>
</html>


こうすることで、アクションクラスの name属性をgetしてくれます。
正確には、getNameメソッドが呼ばれるようです。


なので、試してみました。

<?php
class Test_Main {
    var $name;

    function execute() {
        $this->name = 'foo';

        return 'success';
    }

    function getName() {
        return 'bar';
    }
}

上記で実行すると、nameは、barになりました。


でも、すべての属性において、getterを書くのは、しんどいので。
最初の書き方推奨です。
※間違ってたら誰か指摘してくださ〜い(^^;;

mapleのHelloWorldまで

今更ですが、mapleを真剣に触り始めたので、ちょっと使い方をまとめてみました。

mapleのインストールは省略します。

インストールは、下記URLを参考にして下さい。
http://kunit.jp/maple/support.html

動かす準備

動かすためには、4つのファイルを作成します。

  • エントリポイント
  • アクションクラス
  • maple.ini設定ファイル
  • テンプレートファイル

エントリポイントの作成

まず最初にアクセスされるファイルです。
通常のhtdocs以下にある、phpファイルですね。
htdocs/test/index.php に作成します。

<?php
error_reporting(E_ALL);
//error_reporting(0);
 
/**
 * MapleのBaseディレクトリの設定
 */
define('BASE_DIR', dirname(dirname(__FILE__)) . '/..');

/**
 * Debugフィルターを発動させるかどうかの設定
 */
define('DEBUG_MODE', 0);
 
/**
 * Mapleの設定ファイルの読込み
 */
require_once BASE_DIR . "/webapp/config/maple.inc.php";

/**
 * このアプリの独自設定
 */
define('ACTION_KEY',     'action');
define('CONFIG_FILE',    'maple.ini');
define('DEFAULT_ACTION', 'test_main');
define('LOG_LEVEL',      LEVEL_TRACE);

/**
 * フレームワーク起動
 */
$controller =& new Controller();
$controller->execute();
?>

ほとんどの部分がおまじないです。
1カ所だけ、DEFAULT_ACTIONを設定しないといけません。


実行する、デフォルトのアクションクラスの位置を指定します。
位置指定は、フォルダ構造も含めて厳格に決まっています。


今回の例では、test_mainなので。
webapp/modules/test/main/Main.class.php
のファイルを指します。
_ は / に置き換えて読むとわかりやすいですね。
他の位置に置いてしまうと、動きませんので要注意です。

アクションクラス

アクションの動作を決めるアクションクラスを作成します。
mapleはアクションという単位で、動作をおこないます。

webapp/modules/test/main/Main.class.phpにファイルを作成します。

<?php
class Test_Main {
    function execute() {
        return 'success';
    }
}

アクションクラスには、executeメソッドが必ず必要です。
アクション実行時には、executeメソッドが自動的に呼び出されます。
executeメソッドは、なんらかの返却値が必要になります。返却値は、次で説明するmaple.ini設定ファイルで必要となります。

maple.ini設定ファイル

webapp/modules/test/main/maple.ini に設定ファイルを記述します。
アクションクラスと同じディレクトリに置くことが必要です。

[View]
success = "test/index.html"


先ほど、アクションクラスのexecuteメソッドで指定した、返却値に関連づけるテンプレートを記述いたします。
今回の場合は、successの場合は、test/index.html

テンプレートファイル

最後にテンプレートファイルです。
webapp/templates/test/index.html にファイルを作成します。

<html>
<body>
Hello World!
</body>
</html>

上記の4ファイルを作成することで、mapleでは、HelloWorldを出力することができます。


htdocs/index.phpにアクセスすることで、Hello World!と表示されるのを確認できると思います。
でなければ、どこか打ち間違えている可能性が高いので、見直してみてください。
http://hoge.com/test/index.php
hoge.comは適当に置き換えてください。


HelloWorldを出力するのに、ここまで手間がかかると、どこがいいのやらと思いますね。
でも、本当の力を発揮するのは、フォームを使うときです。
それは、後々紹介します。