repo_zf1/documentation/manual/ja/module_specs/Zend_Dojo-Form-Elements.xml

<?xml version="1.0" encoding="UTF-8"?>
<!-- Reviewed: no -->
<!-- EN-Revision: 19143 -->
<sect2 id="zend.dojo.form.elements">
    <title>Dijit固有のフォーム要素</title>

    <para>
        ビュー・ヘルパーが提供される各々のフォームdijitには、
        対応する<classname>Zend_Form</classname>要素があります。
        dijitパラメータを操作するための以下のメソッドがそれらすべてにあります:
    </para>

    <itemizedlist>
        <listitem><para>
                <methodname>setDijitParam($key, $value)</methodname>:
                dijitパラメータを一つセットします。
                dijitパラメータがすでに存在すれば、上書きされます。
        </para></listitem>

        <listitem><para>
                <methodname>setDijitParams(array $params)</methodname>:
                一度にいくつかのdijitパラメータをセットします。
                渡されたパラメータにマッチする既存のパラメータは上書きされます。
        </para></listitem>

        <listitem><para>
                <methodname>hasDijitParam($key)</methodname>:
                与えられたdijitパラメータが定義されたか存在している場合はtrueを返します。
                それ以外はfalseを返します。
        </para></listitem>

        <listitem><para>
                <methodname>getDijitParam($key)</methodname>:
                与えられたdijitパラメータを返します。
                利用できない場合は null値を返します。
        </para></listitem>

        <listitem><para>
                <methodname>getDijitParams()</methodname>:
                dijitパラメータを全て返します。
        </para></listitem>

        <listitem><para>
                <methodname>removeDijitParam($key)</methodname>:
                与えられたdijitパラメータを除去します。
        </para></listitem>

        <listitem><para>
                <methodname>clearDijitParams()</methodname>:
                現行定義されたdijitパラメータを全て消去します。
        </para></listitem>
    </itemizedlist>

    <para>
        Dijitパラメータは、<code>dijitParams</code> public プロパティに保存されます。
        このように、あなたは単にこのプロパティを要素の上に置くことによって、
        既存のフォーム要素をdijit使用可能にすることができます;
        あなたは、単にパラメータを操作するのを容易にするために、
        上記のアクセッサを持っていません。
    </para>

    <para>
        その上、dijit固有の要素は以下に該当するデコレーターの独特な一覧を実装します:
    </para>

    <programlisting language="php"><![CDATA[
$element->addDecorator('DijitElement')
        ->addDecorator('Errors')
        ->addDecorator('HtmlTag', array('tag' => 'dd'))
        ->addDecorator('Label', array('tag' => 'dt'));
]]></programlisting>

    <para>
        実質的に、Dijit要素が、標準的なViewHelperデコレーターの代わりに使われます。
    </para>

    <para>
        最後に、ベースDijit要素により、
        確実にDojoビュー・ヘルパー・パスがビューの上に置かれることになります。
    </para>

    <para>
        Dijit要素、DijitMultiの変化は<code>Multi</code> abstract フォーム要素の機能を提供します。
        そして、開発者が 'multiOptions' を指定できるようにします。
         - 一般的に select の option またはラジオ のoptionです。
    </para>

    <para>
        以下のdijit要素は、標準的なZend Framework配布において出荷されます。
    </para>

    <sect3 id="zend.dojo.form.elements.button">
        <title>ボタン</title>

        <para>
            <link linkend="zend.form.standardElements.button">標準的なボタン要素</link>に
            由来していないので、
            同じ機能を実装して、ドロップインの代わりとして使うことができます。
            以下の機能が公開されます:
        </para>

        <itemizedlist>
            <listitem><para>
                名前が提供されないならば、
                <methodname>getLabel()</methodname>はボタン・ラベルとして要素名を利用します。
                さらに、翻訳メッセージにマッチした翻訳アダプターが利用できれば、
                それは名前を翻訳します。
            </para></listitem>

            <listitem><para>
                <methodname>isChecked()</methodname>は、
                提出される値がラベルにマッチするかどうか決定します;
                もしマッチするなら、それはtrueを返します。
                これは、フォームが提出されたとき、どのボタンが使われたかについて決定することに役立ちます。
            </para></listitem>
        </itemizedlist>

        <para>
            さらに、デコレーターの<code>DijitElement</code>及び
            <code>DtDdWrapper</code>だけがボタン要素のために使われます。
        </para>

        <example id="zend.dojo.form.elements.button.example">
            <title>ボタンdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'Button',
    'foo',
    array(
        'label' => 'Button Label',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.checkBox">
        <title>チェックボックス</title>

        <para>
            <link linkend="zend.form.standardElements.checkbox">標準的なチェックボックス要素</link>
            に由来していないので、
            それは同じ機能を実装します。
            これは、以下のメソッドが公開されることを意味します
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setCheckedValue($value)</methodname>:
                要素がチェックされたときに使う値を設定します。
            </para></listitem>

            <listitem><para>
                <methodname>getCheckedValue()</methodname>:
                チェックされたときに要素で使う値を取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setUncheckedValue($value)</methodname>:
                チェックされていないときに要素で使う値を設定します。
            </para></listitem>

            <listitem><para>
                <methodname>getUncheckedValue()</methodname>:
                チェックされていないときに要素で使う値を取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setChecked($flag)</methodname>:
                要素をチェック済みにするか否か設定します。
            </para></listitem>

            <listitem><para>
                <methodname>isChecked()</methodname>:
                要素が現在チェック済みか判断します。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.checkBox.example">
            <title>チェックボックスdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'CheckBox',
    'foo',
    array(
        'label'          => 'A check box',
        'checkedValue'   => 'foo',
        'uncheckedValue' => 'bar',
        'checked'        => true,
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.comboBox">
        <title>コンボボックス及びフィルタリング選択</title>

        <para>
            コンボボックス
            <link linkend="zend.dojo.view.dijit.form">dijitビュー・ヘルパー・文書</link>
            にみられるように、コンボボックスは選択とテキスト入力の混合です。
            そして、自動補完及び、提示された選択肢の代わりを指定できるようにします。
            フィルタリング選択は同じことですが、任意の入力を許しません。
        </para>

        <note>
            <title>ラベル値を返すコンボボックス</title>

            <para>
                コンボボックスはラベル値を返します。
                期待に反するオプション値は返しません。
                この理由から、コンボボックスは<code>InArray</code>バリデーターを自動登録しません。
                （FilteringSelectsがそうするけれども）
            </para>
        </note>

        <para>
            コンボボックスとフィルタリング選択フォーム要素は、
            dojo.dataデータ・ストア（使用された場合）を指定することだけでなく、
            選ばれた選択肢を調べて、セットするためにアクセッサとミューテーターを提供します。
            それらはDijitMultiから拡張します。
            そして、それは<methodname>setMultiOptions()</methodname>及び<methodname>setMultiOption()</methodname>メソッドによって
            選ばれた選択肢を指定できます。
            さらに、以下のメソッドを利用できます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>getStoreInfo()</methodname>:
                現行で設定されているデータストア情報を全て取得します。
                現行で設定されたデータがなければ、空の配列を返します。
            </para></listitem>

            <listitem><para>
                <methodname>setStoreId($identifier)</methodname>:
                ストアの識別変数を設定します。
                （通常、Dojoで 'jsId' 属性によって言及されます）
                これは、有効なjavascript変数の名前でなければなりません。
            </para></listitem>

            <listitem><para>
                <methodname>getStoreId()</methodname>:
                ストアの識別変数名を取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setStoreType($dojoType)</methodname>:
                使用するデータストアクラスを設定します;
                例えば "dojo.data.ItemFileReadStore"
            </para></listitem>

            <listitem><para>
                <methodname>getStoreType()</methodname>:
                使用するdojoデータストアクラスを取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setStoreParams(array $params)</methodname>:
                データ・ストア・オブジェクトを構成するために使われるパラメータをいずれも設定します。
                例えば、 dojo.data.ItemFileReadStore データストアでは
                dojo.dataオブジェクトを返す場所を指す 'url' パラメータを期待します。
            </para></listitem>

            <listitem><para>
                <methodname>getStoreParams()</methodname>:
                現行で設定されているデータストアパラメータをいずれも取得します;
                もしなければ、空の配列を返します。
            </para></listitem>

            <listitem><para>
                <methodname>setAutocomplete($flag)</methodname>:
                ユーザーが要素から離れるとき、選ばれた項目が使われるかどうかを示します。
            </para></listitem>

            <listitem><para>
                <methodname>getAutocomplete()</methodname>:
                自動補完フラグの値を取得します。
            </para></listitem>
        </itemizedlist>

        <para>
            dojo.dataストアが要素で登録されなければ、
            登録された選択肢の配列のキーを検証する<code>InArray</code>バリデーターを
            この要素はデフォルトで登録します。
            <methodname>setRegisterInArrayValidator(false)</methodname>を呼び出すことでも、
            <code>registerInArrayValidator</code>設定キーにfalse値を渡すことでも、
            このふるまいを抑制できます。
        </para>

        <example id="zend.dojo.form.elements.comboBox.selectExample">
            <title>コンボボックスdijit要素を選択肢入力として使う</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'ComboBox',
    'foo',
    array(
        'label'        => 'ComboBox (select)',
        'value'        => 'blue',
        'autocomplete' => false,
        'multiOptions' => array(
            'red'    => 'Rouge',
            'blue'   => 'Bleu',
            'white'  => 'Blanc',
            'orange' => 'Orange',
            'black'  => 'Noir',
            'green'  => 'Vert',
        ),
    )
);
]]></programlisting>
        </example>

        <example id="zend.dojo.form.elements.comboBox.datastoreExample">
            <title>コンボボックスdijit要素をデータ・ストアと一緒に使う</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'ComboBox',
    'foo',
    array(
        'label'       => 'ComboBox (datastore)',
        'storeId'     => 'stateStore',
        'storeType'   => 'dojo.data.ItemFileReadStore',
        'storeParams' => array(
            'url' => '/js/states.txt',
        ),
        'dijitParams' => array(
            'searchAttr' => 'name',
        ),
    )
);
]]></programlisting>
        </example>

        <para>
            前述の例は<code>ComboBox</code>の代わりに
            <code>FilteringSelect</code>を使用します。
        </para>
    </sect3>

    <sect3 id="zend.dojo.form.elements.currencyTextBox">
        <title>通貨テキストボックス</title>

        <para>
            通貨テキストボックスは、主に通貨入力をサポートするためにあります。
            通貨はローカライズされるかもしれず、小数も非小数もサポートできます。
        </para>

        <para>
            内部的には、通貨テキストボックスは
            <link linkend="zend.dojo.form.elements.numberTextBox">数値テキストボックス</link>や
            <link linkend="zend.dojo.form.elements.validationTextBox">バリデーションテキストボックス</link>および
            <link linkend="zend.dojo.form.elements.textBox">テキストボックス</link>に由来します;
            それらのクラスのメソッドが全て利用可能です。
            さらに、下記の制約メソッドを使用できます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setCurrency($currency)</methodname>:
                使用する通貨種類を設定します;
                <ulink url="http://en.wikipedia.org/wiki/ISO_4217">ISO-4217</ulink>
                仕様に従うでしょう。
            </para></listitem>

            <listitem><para>
                <methodname>getCurrency()</methodname>:現行の通貨種類を取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setSymbol($symbol)</methodname>: ３文字からなる<ulink
                    url="http://en.wikipedia.org/wiki/ISO_4217">ISO-4217</ulink>
                通貨記号を設定します。
            </para></listitem>

            <listitem><para>
                <methodname>getSymbol()</methodname>:
                現行の通貨記号を取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setFractional($flag)</methodname>:
                通貨で小数を許すかどうか設定します。
            </para></listitem>

            <listitem><para>
                <methodname>getFractional()</methodname>:
                小数フラグの状態を取得します。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.currencyTextBox.example">
            <title>通貨テキストボックスdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'CurrencyTextBox',
    'foo',
    array(
        'label'          => 'Currency:',
        'required'       => true,
        'currency'       => 'USD',
        'invalidMessage' => 'Invalid amount. ' .
                            'Include dollar sign, commas, and cents.',
        'fractional'     => false,
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.dateTextBox">
        <title>日付テキストボックス</title>

        <para>
            日付テキストボックスは、
            カレンダー・ドロップダウンで日付（クライアント側日付確認とフォーマッティングだけでなく）
            を選ぶために提供します。
        </para>

        <para>
            内部的に、日付テキストボックスは
            <link linkend="zend.dojo.form.elements.validationTextBox">バリデーションテキストボックス</link>
            および<link linkend="zend.dojo.form.elements.textBox">テキストボックス</link>
            に由来します;
            それらのクラスのメソッドが全て利用可能です。さらに、
            個別の制約を設定するために下記のメソッドを使用できます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setAmPm($flag)</methodname>及び<methodname>getAmPm()</methodname>:
                時刻でAM/PM 文字列を使うかどうか
            </para></listitem>

            <listitem><para>
                <methodname>setStrict($flag)</methodname>及び<methodname>getStrict()</methodname>:
                入力を確認した時にマッチする厳しい正規表現を使うかどうか。
                デフォルトはfalseですが、空白文字やいくつかの省略形を許します。
            </para></listitem>

            <listitem><para>
                <methodname>setLocale($locale)</methodname>及び<methodname>getLocale()</methodname>:
                指定した要素で使うロケールを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setDatePattern($pattern)</methodname>及び
                <methodname>getDatePattern()</methodname>:
                 日付をフォーマットする<ulink
                    url="http://www.unicode.org/reports/tr35/#Date_Format_Patterns">
                    unicode 日付形式パターン</ulink>を提示または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setFormatLength($formatLength)</methodname>及び
                <methodname>getFormatLength()</methodname>:
                使用する形式の長さの種類を提示または取得します;
                "long"、"short"、"medium"または"full"のどれか一つです。
            </para></listitem>

            <listitem><para>
                <methodname>setSelector($selector)</methodname>及び
                <methodname>getSelector()</methodname>:
                セレクタのスタイルを提示または取得します;
                "date" や "time" のどちらかでしょう。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.dateTextBox.example">
            <title>日付テキストボックスdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'DateTextBox',
    'foo',
    array(
        'label'          => 'Date:',
        'required'       => true,
        'invalidMessage' => 'Invalid date specified.',
        'formatLength'   => 'long',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.editor">
        <title>エディタ</title>

        <para>
            エディタはリッチなHTML内容を作成して、
            編集するために利用できるWYSIWYGエディタを提供します。
            dijit.Editorはプラグイン可能で、
            必要に応じてカスタム・プラグインで拡張されるかもしれません;
            詳しくは<ulink
            url="http://dojotoolkit.org/book/dojo-book-0-9/part-2-dijit/advanced-editing-and-display/editor-rich-text">
            dijit.Editorドキュメント</ulink>をご覧下さい。
        </para>

        <para>
            エディタ・フォーム要素は、
            下記のいくつかのアクセッサとミューテーターを
            いろいろなdijitパラメータを操作するために提供します:
        </para>

        <itemizedlist>
            <listitem>
                <para>
                    <emphasis>captureEvents</emphasis>は、
                    編集エリア自体と連携するイベントです。
                    捕獲したイベントを操作するために以下のアクセッサとミューテーターを利用できます:
                </para>

                <itemizedlist>
                    <listitem><para><methodname>addCaptureEvent($event)</methodname></para></listitem>
                    <listitem><para><methodname>addCaptureEvents(array $events)</methodname></para></listitem>
                    <listitem><para><methodname>setCaptureEvents(array $events)</methodname></para></listitem>
                    <listitem><para><methodname>getCaptureEvents()</methodname></para></listitem>
                    <listitem><para><methodname>hasCaptureEvent($event)</methodname></para></listitem>
                    <listitem><para><methodname>removeCaptureEvent($event)</methodname></para></listitem>
                    <listitem><para><methodname>clearCaptureEvents()</methodname></para></listitem>
                </itemizedlist>
            </listitem>

            <listitem>
                <para>
                    <emphasis>events</emphasis>は、
                    onClickやonKeyUpなどのような標準的なDOMイベントです。
                    イベントを操作するために以下のアクセッサとミューテーターを利用できます:
                </para>

                <itemizedlist>
                    <listitem><para><methodname>addEvent($event)</methodname></para></listitem>
                    <listitem><para><methodname>addEvents(array $events)</methodname></para></listitem>
                    <listitem><para><methodname>setEvents(array $events)</methodname></para></listitem>
                    <listitem><para><methodname>getEvents()</methodname></para></listitem>
                    <listitem><para><methodname>hasEvent($event)</methodname></para></listitem>
                    <listitem><para><methodname>removeEvent($event)</methodname></para></listitem>
                    <listitem><para><methodname>clearEvents()</methodname></para></listitem>
                </itemizedlist>
            </listitem>

            <listitem>
                <para>
                    <emphasis>plugins</emphasis>はエディターにツールバーのための追加のツールや、
                    許可する追加スタイルなどの機能を加えます。
                    プラグインを操作するために以下のアクセッサとミューテーターを利用できます:
                </para>

                <itemizedlist>
                    <listitem><para><methodname>addPlugin($plugin)</methodname></para></listitem>
                    <listitem><para><methodname>addPlugins(array $plugins)</methodname></para></listitem>
                    <listitem><para><methodname>setPlugins(array $plugins)</methodname></para></listitem>
                    <listitem><para><methodname>getPlugins()</methodname></para></listitem>
                    <listitem><para><methodname>hasPlugin($plugin)</methodname></para></listitem>
                    <listitem><para><methodname>removePlugin($plugin)</methodname></para></listitem>
                    <listitem><para><methodname>clearPlugins()</methodname></para></listitem>
                </itemizedlist>
            </listitem>

            <listitem>
                <para>
                    <emphasis>editActionInterval</emphasis>は、
                    アンドゥ操作のためにイベントをまとめるために使われます。
                    デフォルトでこの値は3秒です。
                    <methodname>setEditActionInterval($interval)</methodname>メソッドが値を設定するために使われるかもしれません。
                    一方で、<methodname>getEditActionInterval()</methodname>が値を取得します。
                </para>
            </listitem>

            <listitem>
                <para>
                    <emphasis>focusOnLoad</emphasis>は、
                    ページが読み込まれたとき、
                    この指定のエディタがフォーカスを受けるかどうか判断するために使われます。
                    デフォルトでこれはfalseです。
                    メソッド<methodname>setFocusOnLoad($flag)</methodname>が値を設定するために使われるかもしれません。
                    一方で、<methodname>getFocusOnLoad()</methodname>が値を取得します。
                </para>
            </listitem>

            <listitem>
                <para>
                    <emphasis>height</emphasis>はエディターの高さを指定します;
                    デフォルトでこれは300pxです。
                    メソッド<methodname>setHeight($height)</methodname>が値を設定するために使われるかもしれません。
                    一方で、<methodname>getHeight()</methodname>が値を取得します。
                </para>
            </listitem>

            <listitem>
                <para>
                    <emphasis>inheritWidth</emphasis>は、
                    エディタが親コンテナの幅と単純にデフォルトの100%幅のどちらを使うか決定するために使われます。
                    デフォルトでこれはfalseです。
                    (すなわち、画面の幅一杯を満たします)
                    メソッド<methodname>setInheritWidth($flag)</methodname>が値を設定するために使われるかもしれません。
                    一方で、<methodname>getInheritWidth()</methodname>が値を取得します。
                </para>
            </listitem>

            <listitem>
                <para>
                    <emphasis>minHeight</emphasis>はエディターの高さの最小値を設定します;
                    デフォルトでこれは1emです。
                    メソッド<methodname>setMinHeight($height)</methodname>が値を設定するために使われるかもしれません。
                    一方で、<methodname>getMinHeight()</methodname>が値を取得します。
                </para>
            </listitem>

            <listitem>
                <para>
                    <emphasis>styleSheets</emphasis>は、
                    どの追加<acronym>CSS</acronym>スタイルシートがエディタの表示に影響を及ぼすために使われるか示します。
                    デフォルトでは何も登録されず、それはページ・スタイルを継承します。
                    エディタ・スタイルシートを操作するために以下のアクセッサとミューテーターを利用できます:
                </para>

                <itemizedlist>
                    <listitem><para><methodname>addStyleSheet($styleSheet)</methodname></para></listitem>
                    <listitem>
                        <para><methodname>addStyleSheets(array $styleSheets)</methodname></para>
                    </listitem>
                    <listitem>
                        <para><methodname>setStyleSheets(array $styleSheets)</methodname></para>
                    </listitem>
                    <listitem><para><methodname>getStyleSheets()</methodname></para></listitem>
                    <listitem><para><methodname>hasStyleSheet($styleSheet)</methodname></para></listitem>
                    <listitem><para><methodname>removeStyleSheet($styleSheet)</methodname></para></listitem>
                    <listitem><para><methodname>clearStyleSheets()</methodname></para></listitem>
                </itemizedlist>
            </listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.editor.example">
            <title>エディタdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement('editor', 'content', array(
    'plugins'            => array('undo', '|', 'bold', 'italic'),
    'editActionInterval' => 2,
    'focusOnLoad'        => true,
    'height'             => '250px',
    'inheritWidth'       => true,
    'styleSheets'        => array('/js/custom/editor.css'),
));
]]></programlisting>
        </example>

        <note>
            <title>エディタ Dijit は既定で div を使います</title>

            <para>
                エディタ dijit は既定で <acronym>HTML</acronym> の <acronym>DIV</acronym> を使います。
                <classname>dijit._editor.RichText</classname> 資料は、
                HTML の <acronym>TEXTAREA</acronym> の上にビルドされたそれを持つことが
                セキュリティに影響するかもしれないことを示します。
            </para>

            <para>
                言うことには、<acronym>TEXTAREA</acronym>に上品に退化できる
                エディタ・ウィジェットを望む機会があるかもしれません。
                そのような場面では、 <varname>degrade</varname> プロパティを <constant>true</constant>
                に設定することによってそうすることができます。
            </para>

            <programlisting language="php"><![CDATA[
// 初期化にて
$editor = new Zend_Dojo_Form_Element_Editor('foo', array(
    'degrade' => true,
));

// フォームを通じた構築
$form->addElement('editor', 'content', array(
    'degrade' => true,
));

// または初期化後
$editor->degrade = true;
]]></programlisting>
        </note>
    </sect3>

    <sect3 id="zend.dojo.form.elements.horizontalSlider">
        <title>水平スライダー</title>

        <para>
            水平スライダーは、
            ある範囲で数値を選択するためのスライダーUI部品を提供します。
            内部的には、それはフォームによって送信されるhidden要素の値をセットします。
        </para>

        <para>
            水平スライダーは、<link
                linkend="zend.dojo.form.elements.slider">抽象的なスライダーdijit要素</link>に由来します。
            さらに、スライダー罫線と罫線ラベルをセットして設定するための、
            いろいろなメソッドがあります。
        </para>

        <itemizedlist>
            <listitem>
                <para>
                    <methodname>setTopDecorationDijit($dijit)</methodname>及び
                    <methodname>setBottomDecorationDijit($dijit)</methodname>:
                    スライダーの上側か下側で使うdijitの名前をセットします。
                    これは、接頭辞 "dijit.form." を含んではいけません。
                    むしろ final 名だけ
                    - "HorizontalRule" または "HorizontalRuleLabels" のうちの1つ -
                    を含まなければなりません。
                </para>
            </listitem>

            <listitem>
                <para>
                    <methodname>setTopDecorationContainer($container)</methodname>及び
                    <methodname>setBottomDecorationContainer($container)</methodname>:
                    罫線コンテナ要素のために使用する名前を指定します;
                    例えば、'topRule' や 'topContainer'など。
                </para>
            </listitem>

            <listitem>
                <para>
                    <methodname>setTopDecorationLabels(array $labels)</methodname>及び
                    <methodname>setBottomDecorationLabels(array $labels)</methodname>:
                    RuleLabels dijit型のうちの1つで使用するラベルをセットします。
                    これらは、インデックスを付けられた配列でなければなりません;
                    与えられたラベル位置（例えば始めまたは終わり）をスキップするために、
                    一つの空の場所を指定します。
                </para>
            </listitem>

            <listitem>
                <para>
                    <methodname>setTopDecorationParams(array $params)</methodname>及び
                    <methodname>setBottomDecorationParams(array $params)</methodname>:
                    与えられた罫線、
                    またはRuleLabels dijitを構成するときに使うdijitパラメータです。
                </para>
            </listitem>

            <listitem>
                <para>
                    <methodname>setTopDecorationAttribs(array $attribs)</methodname>及び
                    <methodname>setBottomDecorationAttribs(array $attribs)</methodname>:
                    与えられた罫線、
                    またはRuleLabels HTML要素コンテナのために指定するHTML属性です。
                </para>
            </listitem>

            <listitem>
                <para>
                    <methodname>getTopDecoration()</methodname>及び
                    <methodname>getBottomDecoration()</methodname>:
                    上記のミューテーターによって提示されたように、
                    与えられた罫線またはRuleLabels定義のためにすべてのメタデータを取得します。
                </para>
            </listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.horizontalSlider.example">
            <title>水平スライダーdijit要素の使用例</title>

            <para>
                下記では、-10から10の間の整数を選択する水平スライダーを生成します。
                上側には20%、40%、60%そして80%で印をつけられたラベルがあります、
                下側には、0、50%そして100%の罫線があります。
                値が変わるたびに、値を保存しているhidden要素は更新されます。
            </para>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'HorizontalSlider',
    'horizontal',
    array(
        'label'                     => 'HorizontalSlider',
        'value'                     => 5,
        'minimum'                   => -10,
        'maximum'                   => 10,
        'discreteValues'            => 11,
        'intermediateChanges'       => true,
        'showButtons'               => true,
        'topDecorationDijit'        => 'HorizontalRuleLabels',
        'topDecorationContainer'    => 'topContainer',
        'topDecorationLabels'       => array(
                ' ',
                '20%',
                '40%',
                '60%',
                '80%',
                ' ',
        ),
        'topDecorationParams'      => array(
            'container' => array(
                'style' => 'height:1.2em; font-size=75%;color:gray;',
            ),
            'list' => array(
                'style' => 'height:1em; font-size=75%;color:gray;',
            ),
        ),
        'bottomDecorationDijit'     => 'HorizontalRule',
        'bottomDecorationContainer' => 'bottomContainer',
        'bottomDecorationLabels'    => array(
                '0%',
                '50%',
                '100%',
        ),
        'bottomDecorationParams'   => array(
            'list' => array(
                'style' => 'height:1em; font-size=75%;color:gray;',
            ),
        ),
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.numberSpinner">
        <title>数スピナー</title>

        <para>
            数スピナーは、数値を入力するためのテキスト要素です;
            設定された量によって値を増加させたり、減少させるための要素を含みます。
        </para>

        <para>
            下記のメソッドが利用できます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setDefaultTimeout($timeout)</methodname>及び
                <methodname>getDefaultTimeout()</methodname>:
                ボタンが押されたままのときと、値が変更されるときの間の既定のタイムアウトを
                ミリ秒単位で設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setTimeoutChangeRate($rate)</methodname>及び
                <methodname>getTimeoutChangeRate()</methodname>:
                ボタンが押されたままのとき、変化がなされる割合をミリ秒単位で設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setLargeDelta($delta)</methodname>及び
                <methodname>getLargeDelta()</methodname>:
                ボタンが押されたままのとき、数値が変わるべき量を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setSmallDelta($delta)</methodname>及び
                <methodname>getSmallDelta()</methodname>:
                ボタンが一度押されたとき、数が変わるべきデルタを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setIntermediateChanges($flag)</methodname>及び
                <methodname>getIntermediateChanges()</methodname>:
                ボタンが押されたままのとき、
                各々の値が変化するごとに表示されるべきかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setRangeMessage($message)</methodname>及び
                <methodname>getRangeMessage()</methodname>:
                利用できる値の範囲を指示しているメッセージを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setMin($value)</methodname>及び<methodname>getMin()</methodname>:
                使用可能な最小値を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setMax($value)</methodname>及び<methodname>getMax()</methodname>:
                使用可能な最大値を設定または取得します。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.numberSpinner.example">
            <title>数スピナーdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'NumberSpinner',
    'foo',
    array(
        'value'             => '7',
        'label'             => 'NumberSpinner',
        'smallDelta'        => 5,
        'largeDelta'        => 25,
        'defaultTimeout'    => 500,
        'timeoutChangeRate' => 100,
        'min'               => 9,
        'max'               => 1550,
        'places'            => 0,
        'maxlength'         => 20,
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.numberTextBox">
        <title>数テキストボックス</title>

        <para>
            数テキストボックスは、数を入力するためのテキスト要素です;
            数スピナーとは異なり、数は手で入力します。
            バリデーションと制約は、
            数が特定の範囲または形式にとどまることを確実とするために提示できます。
        </para>

        <para>
            内部的には、数テキストボックスは<link
                linkend="zend.dojo.form.elements.validationTextBox">バリデーションテキストボックス</link>
            及び<link linkend="zend.dojo.form.elements.textBox">テキストボックス</link>に由来します;
            それらのクラスのメソッドが全て利用可能です。さらに、
            個別の制約を設定するために下記のメソッドを使用できます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setLocale($locale)</methodname>及び<methodname>getLocale()</methodname>:
                このdijitを利用するために指定されたまたは代替のロケールを指定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setPattern($pattern)</methodname>及び
                <methodname>getPattern()</methodname>:
                数をフォーマットするために使う<ulink
                url="http://www.unicode.org/reports/tr35/#Number_Format_Patterns">数値パターン形式</ulink>
                を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setType($type)</methodname>及び<methodname>getType()</methodname>:
                使用する数の形式型を取得します。
                ('decimal'、'percent'または'currency'のいずれかであるべきです)。
            </para></listitem>

            <listitem><para>
                <methodname>setPlaces($places)</methodname>及び<methodname>getPlaces()</methodname>:
                サポートする小数位の数を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setStrict($flag)</methodname>及び<methodname>getStrict()</methodname>:
                空白文字及び数字以外の文字についてどの程度ゆるやかに許されるか示す
                厳密性フラグの値を設定または取得します。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.numberTextBox.example">
            <title>数テキストボックスdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'NumberTextBox',
    'elevation',
    array(
        'label'          => 'NumberTextBox',
        'required'       => true,
        'invalidMessage' => 'Invalid elevation.',
        'places'         => 0,
        'constraints'    => array(
            'min'    => -20000,
            'max'    => 20000,
        ),
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.passwordTextBox">
        <title>パスワードテキストボックス</title>

        <para>
            パスワードテキストボックスは、
            パスワード入力のみに結び付けられたバリデーションテキストボックスです;
            その唯一の目的は、dijitテーマを与えられたテキスト入力を
            クライアント側バリデーションを提示するパスワードのためにできるようにすることです。
        </para>

        <para>
            内部的には、パスワードテキストボックスは<link
                linkend="zend.dojo.form.elements.validationTextBox">バリデーションテキストボックス</link>
            及び<link linkend="zend.dojo.form.elements.textBox">テキストボックス</link>
            に由来します;
            それらのクラスのメソッドが全て利用可能です。
        </para>

        <example id="zend.dojo.form.elements.passwordTextBox.example">
            <title>パスワードテキストボックスの使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'PasswordTextBox',
    'password',
    array(
        'label'          => 'Password',
        'required'       => true,
        'trim'           => true,
        'lowercase'      => true,
        'regExp'         => '^[a-z0-9]{6,}$',
        'invalidMessage' => 'Invalid password; ' .
                            'must be at least 6 alphanumeric characters',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.radioButton">
        <title>ラジオボタン</title>

        <para>
            ラジオボタンは、他のDojo dijitと一貫したルック＆フィールを提示するために、
            標準的なラジオ入力要素をラップします。
        </para>

        <para>
            ラジオボタンはDijitMultiから拡張します。
            そして、<methodname>setMultiOptions()</methodname>及び<methodname>setMultiOption()</methodname>メソッドによって
            選ばれた選択肢を指定できます。
        </para>

        <para>
            デフォルトでこの要素は、
            配列に対して登録された選択肢のキーを確認する<code>InArray</code>バリデーターを登録します。
            <methodname>setRegisterInArrayValidator(false)</methodname>または
            <code>registerInArrayValidator</code>のどちらを呼び出しても、
            設定キーにfalse値を渡すことによってこのふるまいを抑制できます。
        </para>

        <example id="zend.dojo.form.elements.radioButton.example">
            <title>ラジオボタンdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'RadioButton',
    'foo',
    array(
        'label' => 'RadioButton',
        'multiOptions'  => array(
            'foo' => 'Foo',
            'bar' => 'Bar',
            'baz' => 'Baz',
        ),
        'value' => 'bar',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.simpletextarea">
        <title>シンプルテキストエリア</title>

        <para>
            シンプルテキストエリアは、主に標準的なHTMLの textarea のようにふるまいます。
            しかし、それは列または行の設定をサポートしません。
            その代わり、textarea幅は、標準的な<acronym>CSS</acronym>幅を使用して指定されるべきです。
            テキストエリアとは異なり、自動的に成長しません。
        </para>

        <example id="zend.dojo.form.elements.simpletextarea.example">
            <title>シンプルテキストエリアdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'SimpleTextarea',
    'simpletextarea',
    array(
        'label'    => 'SimpleTextarea',
        'required' => true,
        'style'    => 'width: 80em; height: 25em;',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.slider">
        <title>スライダーabstract要素</title>

        <para>
            スライダーは
            <link linkend="zend.dojo.form.elements.horizontalSlider">水平スライダー</link>
            及び
            <link linkend="zend.dojo.form.elements.verticalSlider">垂直スライダー</link>
            の両方に由来するabstract要素です。
            スライダーを構成するために、いくつかの一般的なメソッドを公開します:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setClickSelect($flag)</methodname>及び
                <methodname>getClickSelect()</methodname>:
                スライダーをクリックしたら値を変更するかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setIntermediateChanges($flag)</methodname>及び
                <methodname>getIntermediateChanges()</methodname>:
                各々のスライダー変化イベントにdijitが通知を送るかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setShowButtons($flag)</methodname>及び
                <methodname>getShowButtons()</methodname>:
                どちらかの端にボタンが表示されるかどうか示すフラグを設定または取得します。;
                もし表示されるなら、スライダーの値を変えるために、ユーザーはボタンをクリックできます。
            </para></listitem>

            <listitem><para>
                <methodname>setDiscreteValues($value)</methodname>及び
                <methodname>getDiscreteValues()</methodname>:
                スライダーによって表される不連続な値の数を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setMaximum($value)</methodname>及び<methodname>getMaximum()</methodname>:
                スライダーの最大値を設定します。
            </para></listitem>

            <listitem><para>
                <methodname>setMinimum($value)</methodname>及び<methodname>getMinimum()</methodname>:
                スライダーの最小値を設定します。
            </para></listitem>

            <listitem><para>
                <methodname>setPageIncrement($value)</methodname>及び
                <methodname>getPageIncrement()</methodname>:
                スライダーがキーボード・イベントで変わる量を設定します。
            </para></listitem>
        </itemizedlist>

        <para>
            使用例は、各々の具体的な拡張クラスで提供されます。
        </para>
    </sect3>

    <sect3 id="zend.dojo.form.elements.submitButton">
        <title>サブミットボタン</title>

        <para>
            SubmitButtonという名前のDijitはありませんが、
            どんなjavascriptとの結合も追加で必要とせずに、フォームを送信できるボタンdijitを提供するために、
            １つをここに含めます。
            それは、まさに<link linkend="zend.dojo.form.elements.button">ボタンdijit</link>のように動作します。
        </para>

        <example id="zend.dojo.form.elements.submitButton.example">
            <title>サブミットボタンdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'SubmitButton',
    'foo',
    array(
        'required'   => false,
        'ignore'     => true,
        'label'      => 'Submit Button!',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.textBox">
        <title>テキストボックス</title>

        <para>
            テキストボックスは、
            主に他のdijitsに調和したルック＆フィールで入力されるテキストを提供するために含まれます。
            しかし、以下のメソッドで表されるいくらかのマイナーなフィルタリングとバリデーション機能も含みます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setLowercase($flag)</methodname>及び
                <methodname>getLowercase()</methodname>:
                入力を小文字にキャストすべきかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setPropercase($flag)</methodname>及び
                <methodname>getPropercase()</methodname>:
                入力をProper Case(訳注：先頭を大文字、他を小文字にすること)にキャストすべきかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setUppercase($flag)</methodname>及び<methodname>getUppercase()</methodname>:
                入力を大文字にキャストすべきかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setTrim($flag)</methodname>及び<methodname>getTrim()</methodname>:
                先立つまたは後続する空白を除去すべきかどうか示すフラグを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setMaxLength($length)</methodname>及び
                <methodname>getMaxLength()</methodname>:
                入力の長さの上限を設定または取得します。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.textBox.example">
            <title>テキストボックスdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'TextBox',
    'foo',
    array(
        'value'      => 'some text',
        'label'      => 'TextBox',
        'trim'       => true,
        'propercase' => true,
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.textarea">
        <title>テキストエリア</title>

        <para>
            テキストエリアは、主に標準的なHTMLの textarea のようにふるまいます。
            しかし、それは列または行の設定をサポートしません。
            その代わり、textareaの幅は、標準的な<acronym>CSS</acronym>幅を使用して指定されるべきです;
            列は、完全に省略されます。
            テキストが追加されるたびに、textareaは垂直に伸びます。
        </para>

        <example id="zend.dojo.form.elements.textarea.example">
            <title>テキストエリアdijit要素の使用例</title>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'Textarea',
    'textarea',
    array(
        'label'    => 'Textarea',
        'required' => true,
        'style'    => 'width: 200px;',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.timeTextBox">
        <title>時刻テキストボックス</title>

        <para>
            時刻テキストボックスは、
            時刻を選ぶためにドロップダウンを提示するテキスト入力です。
            ドロップダウンは指定された増分で、時刻の特定のウインドウを示すように構成されるかもしれません。
        </para>

        <para>
            内部的には、時刻テキストボックスは<link
                linkend="zend.dojo.form.elements.dateTextBox">日付テキストボックス</link>、
            <link
                linkend="zend.dojo.form.elements.validationTextBox">バリデーションテキストボックス</link>
            及び<link linkend="zend.dojo.form.elements.textBox">テキストボックス</link>に由来します;
            それらのクラスのメソッドが全て利用可能です。さらに、
            個別の制約を設定するために下記のメソッドを使用できます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setTimePattern($pattern)</methodname>及び
                <methodname>getTimePattern()</methodname>:
                時刻をフォーマットするための<ulink
                    url="http://www.unicode.org/reports/tr35/#Date_Format_Patterns">unicode時間形式パターン</ulink>
                を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setClickableIncrement($format)</methodname>及び
                <methodname>getClickableIncrement()</methodname>:
                Time Pickerでクリックできる全ての要素で
                増分値を示す<ulink
                    url="http://en.wikipedia.org/wiki/ISO_8601">ISO-8601</ulink>
                文字列を設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setVisibleIncrement($format)</methodname>及び
                <methodname>getVisibleIncrement()</methodname>:
                時刻選択にて見える増分を設定します;
                ISO-8601フォーマットに従わなければなりません。
            </para></listitem>

            <listitem><para>
                <methodname>setVisibleRange($format)</methodname>及び
                <methodname>getVisibleRange()</methodname>:
                時刻選択にていつでも見える時刻の範囲を設定または取得します;
                ISO-8601フォーマットに従わなければなりません。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.timeTextBox.example">
            <title>時刻テキストボックスdijit要素の使用例</title>

            <para>
                以下は、時刻に２時を表示する、増分が10分毎の時刻テキストボックスをつくります。
            </para>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'TimeTextBox',
    'foo',
    array(
        'label'              => 'TimeTextBox',
        'required'           => true,
        'visibleRange'       => 'T04:00:00',
        'visibleIncrement'   => 'T00:10:00',
        'clickableIncrement' => 'T00:10:00',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.validationTextBox">
        <title>バリデーションテキストボックス</title>

        <para>
            バリデーションテキストボックスは、
            バリデーションと制約をテキスト入力に加える能力を提供します。
            内部的には、<link
                linkend="zend.dojo.form.elements.textBox">テキストボックス</link>に由来します。
            dijitパラメータを操作するために、以下のアクセッサとミューテーターを加えます:
        </para>

        <itemizedlist>
            <listitem><para>
                <methodname>setInvalidMessage($message)</methodname>及び
                <methodname>getInvalidMessage()</methodname>:
                値がバリデーションされないときに表示するtooltipメッセージを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setPromptMessage($message)</methodname>及び
                <methodname>getPromptMessage()</methodname>:
                要素の使用方法のために表示されるtooltipメッセージを設定または取得します。
            </para></listitem>

            <listitem><para>
                <methodname>setRegExp($regexp)</methodname>及び<methodname>getRegExp()</methodname>:
                要素を確認するために使用する正規表現を取得します。
                正規表現は、バウンダリ（<acronym>PHP</acronym>のpreg* ファミリーの関数と異なります）を必要としません。
            </para></listitem>

            <listitem><para>
                <methodname>setConstraint($key, $value)</methodname>及び
                <methodname>getConstraint($key)</methodname>:
                要素を確認するときに使う追加制約を設定または取得します;
                サブクラスで主に使われます。
                制約は、dijitパラメータの 'constraints' キーに保存されます。
            </para></listitem>

            <listitem><para>
                <methodname>setConstraints(array $constraints)</methodname>及び
                <methodname>getConstraints()</methodname>:
                要素を確認するときに使う個々の制約を設定または取得します;
                サブクラスで主に使われます。
            </para></listitem>

            <listitem><para>
                <methodname>hasConstraint($key)</methodname>:
                与えられた制約が存在するかどうか調べます。
            </para></listitem>

            <listitem><para>
                <methodname>removeConstraint($key)</methodname>及び
                <methodname>clearConstraints()</methodname>:
                要素のために個別またはすべての制約を取り除きます。
            </para></listitem>
        </itemizedlist>

        <example id="zend.dojo.form.elements.validationTextBox.example">
            <title>バリデーションテキストボックスdijit要素の使用例</title>

            <para>
                以下は、
                単語文字（すなわち、空白や大部分の句読点は無効です）だけから成る
                一つのストリングを必要とするバリデーション・テキストボックスをつくります。
            </para>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'ValidationTextBox',
    'foo',
    array(
        'label'          => 'ValidationTextBox',
        'required'       => true,
        'regExp'         => '[\w]+',
        'invalidMessage' => 'Invalid non-space text.',
    )
);
]]></programlisting>
        </example>
    </sect3>

    <sect3 id="zend.dojo.form.elements.verticalSlider">
        <title>垂直スライダー</title>

        <para>
            垂直スライダーは<link
                linkend="zend.dojo.form.elements.horizontalSlider">水平スライダー</link>
            の兄弟分で、あらゆる点でその要素のように動作します。
            唯一本当に違うところは、
            'top*' 及び 'bottom*' メソッドが 'left*' and 'right*' で置き換えられ、
            HorizontalRule 及び HorizontalRuleLabels を使う代わりに、
            VerticalRule 及び VerticalRuleLabels が使われることです。
        </para>

        <example id="zend.dojo.form.elements.verticalSlider.example">
            <title>垂直スライダーdijit要素の使用例</title>

            <para>
                下記では、-10から10の間の整数を選択する垂直スライダーを生成します。
                左側には20%、40%、60%そして80%で印をつけられたラベルがあります、
                右側には、0、50%そして100%の罫線があります。
                値が変わるたびに、値を保存しているhidden要素は更新されます。
            </para>

            <programlisting language="php"><![CDATA[
$form->addElement(
    'VerticalSlider',
    'foo',
    array(
        'label'                    => 'VerticalSlider',
        'value'                    => 5,
        'style'                    => 'height: 200px; width: 3em;',
        'minimum'                  => -10,
        'maximum'                  => 10,
        'discreteValues'           => 11,
        'intermediateChanges'      => true,
        'showButtons'              => true,
        'leftDecorationDijit'      => 'VerticalRuleLabels',
        'leftDecorationContainer'  => 'leftContainer',
        'leftDecorationLabels'     => array(
                ' ',
                '20%',
                '40%',
                '60%',
                '80%',
                ' ',
        ),
        'rightDecorationDijit' => 'VerticalRule',
        'rightDecorationContainer' => 'rightContainer',
        'rightDecorationLabels' => array(
                '0%',
                '50%',
                '100%',
        ),
    )
);
]]></programlisting>
        </example>
    </sect3>
</sect2>
<!--
vim:se ts=4 sw=4 et:
-->