Category: Ethna
EthnaのSmartyPluginである、{form_input} (このプラグインの詳細については BoBlog ≫ Ethna: {form_input}, {form_name} を参照してください。) ですが、これには Selectタグ, input type="radio", input type="checkbox" の実装がまだなされていませんでした。

これは欲しいなということで、、、
仕事もヒト段落したし。
次の仕事はどうみてもEthna使うし。
その合間に作っておけばあとで楽できるかな。

そんな思いで、何とかまだプロト的ですが作ってみました。
しかし、すごく {form_input} に渡すパラメータが増えてます。これでいいのか!?

実装コードは、
http://as-roma.com/ethna/projBop_ViewClass.phps (まだバグ多しw)
こちらです。
isFreeze(); というのが混ざってますが、ご愛嬌。一端無視してください。これに関しては、数日中に説明します。

selectタグ - Basic

まずはselectタグの入門編です。簡単にサンプルでも。

渡すActionFormはこんなの。
class xxx_Form_TestDo extends projBop_ActionForm
{
  var $form = array(
    'selector' => array(
      'name' => 'せれくた',
      'form_type' => FORM_TYPE_SELECT,
      'type' => VAR_TYPE_STRING,
    ),
  );
}
これを、helper_action_form or 該当ActionのActionformにセットします。

また、選択肢は基本的にViewで決めてセットします。入力値を元に選択肢を決めたりする場合もあるのでその場合はAction側になるかもですが。
ViewClass側のコードはこんな感じ。
class xxx_View_Test extends projBop_ViewClass
{
  function preforward()
  {
    $this->addActionFormHelper('test_do');
    
    $this->af->setApp('selector'array(
      '1' => array(
        'name' => 'ほげほげ',
      ),
      '2' => array(
        'name' => 'ふがふが',
      ),
    ));
  }
}
これで、セレクタの選択肢を決定させてます。また、基本的な渡す値の形式自体は以前のEthnaからあったSmartyPlugin {select}と同一です。

そして、テンプレート側は、、、
{form_input name="selector" source=$app.selector empty="選択してください"} このような形。
属性と値の定義としては
(*) name
いつもどおり、ActionForm側の設定名
(*) source
選択肢のデータ (形式としては {select} と同一
empty
「選択してください」等の文字列を設定する。空の選択肢を生成

といった形。
これで生成されるタグというと。。。
<select name="selector">
  <option value="">選択してください</option>
  <option value="1">ほげほげ</option>
  <option value="2">ふがふが</option>
</select>
このようになります。

もちろん、ActionFormに値が登録されていて、マッチする値があれば selected="selected" が設定されます。

RadioButton - Basic

次はラジオボタンの入門編です。
上のselectタグと基本的には同じなので結構簡易的に説明していきます。

ActionForm
class xxx_Form_TestDo extends projBop_ActionForm
{
  var $form = array(
    'radio' => array(
      'name' => 'らじおー',
      'form_type' => FORM_TYPE_RADIO,
      'type' => VAR_TYPE_STRING,
    ),
  );
}
違いといえば form_type。FORM_TYPE_RADIOになってます。

値の渡し方も同一。
class xxx_View_Test extends projBop_ViewClass
{
  function preforward()
  {
    $this->addActionFormHelper('test_do');
    
    $this->af->setApp('radio'array(
      'male' => array(
        'name' => '男',
      ),
      'female' => array(
        'name' => '女',
      ),
    ));
  }
}
まったくおなじですね。

テンプレートは、
{form_input name="radio" source=$app.radio} こうなりました。emptyが消えたのが特徴的です。

これで生成されるタグは、
<input type="radio" name="radio" value="male" id="ethRadio_a774e3fa3bfc725bd7944ed41b6a05b2" /><label for="ethRadio_a774e3fa3bfc725bd7944ed41b6a05b2">男</label>&nbsp;
<input type="radio" name="radio" value="female" id="ethRadio_e32af4b3c9c7f2d0bdf93280b9646564" /><label for="ethRadio_e32af4b3c9c7f2d0bdf93280b9646564">女</label>
このようになります。
一応、labelに対応させています。idはシステム側で自動生成しています。

checkbox - Basic

最後にチェックボックスの入門編です。
ラジオボタンと基本的には同一ですが、一箇所大きく違うので注意してください。

ActionFormはこのような形.
class xxx_Form_TestDo extends projBop_ActionForm
{
  var $form = array(
    'check' => array(
      'name' => 'ちぇっくぼっくす',
      'form_type' => FORM_TYPE_CHECKBOX,
      'type' => array(VAR_TYPE_STRING),
    ),
  );
}
このような形。type => array(VAR_TYPE_STRING), ここに注意してください。チェックボックスの場合、複数の値が返される場合があるためこのような設定になっています。

Viewからはもちろん同一。
class xxx_View_Test extends projBop_ViewClass
{
  function preforward()
  {
    $this->addActionFormHelper('test_do');
    
    $this->af->setApp('checkSource'array(
      '1' => array(
        'name' => 'ふふふ',
      ),
      '2' => array(
        'name' => 'とほほ',
      ),
      '3' => array(
        'name' => 'わーい',
      ),
      '4' => array(
        'name' => '日本は勝つ!',
      ),
    ));
  }
}
フォーマットはこれまでと同じですね。

最後にテンプレート。
{form_input name="check" source=$app.checkSource} このように、ラジオボタンと変わりませんね。

これで出力されるタグというのは、
<input type="checkbox" name="check[]" value="1" checked="checked" id="ethCheck_3f268a535d76578d48af2d98a9b5aed7" /><label for="ethCheck_3f268a535d76578d48af2d98a9b5aed7">ふふふ</label><br />
<input type="checkbox" name="check[]" value="2" id="ethCheck_36ee3333b39d17154e698daca4295edd" /><label for="ethCheck_36ee3333b39d17154e698daca4295edd">とほほ</label><br />
<input type="checkbox" name="check[]" value="3" id="ethCheck_e5058a61e22656b980153c4e10b46fa6" /><label for="ethCheck_e5058a61e22656b980153c4e10b46fa6">わーい</label><br />
<input type="checkbox" name="check[]" value="4" checked="checked" id="ethCheck_230cb5f15c1d7eab316a3a53cb6c551a" /><label for="ethCheck_230cb5f15c1d7eab316a3a53cb6c551a">日本は勝つ!</label>
このようになります。

こうすることで、一応大抵のフォームエレメントが一発で出力できることになります。
もう少し、見た目的にclassとか使いたいなという意見はあると思いますが、それには対応しているので、数日中に書かれるであろう応用編をご覧ください。
Posted by BoBpp at 14:58:06 |はてなブックマークに追加

Trackback

Trackback
There are currently no trackbacks for this item.
Use this TrackBack url to ping this item (right-click, copy link target). If your blog does not support Trackbacks you can manually add your trackback by using this form.

Comment

コメントがありません

Add Comment

:

:
: