WAP 1.0端末でのフォーム変換処理例。

WAP 1.0端末(EZウェブ旧世代機, オープンウェーブ社海外端末)ではHTMLではなくWML 1.1に変換されます。

このため、フォームの変換も特別なものとなります。

変換前のフォーム例。

今、以下のフォームを変換するものとします。

<form method="post" action="http://○○">
    <dl>
        <dt>お名前</dt>
        <dd>
            <input type="text" name="CNAME" value="お名前" size="20" maxlength="40" istyle="1" />
            <input type="hidden" name="HNAME" value="お名前" />
            </dd>
        <dt>パスワード</dt>
        <dd><input type="password" name="PASSWD" size="8" maxlength="8" istyle="4" /></dd>

        <dt>性別</dt>
        <dd>
            <input type="radio" name="SEX" value="男" />男性
            <input type="radio" name="SEX" value="女" checked="checked" />女性
            <input type="radio" name="SEX" value="G" />法人
            </dd>

        <dt>ご趣味</dt>
        <dd>
            <input type="checkbox" name="HOBBY" value="PC" />パソコン
            <input type="checkbox" name="HOBBY" value="SP" />スポーツ
            <input type="checkbox" name="HOBBY" value="読書" checked="checked" />読書
            <input type="checkbox" name="HOBBY" value="OT" />その他
            </dd>

        <dt>お使いの携帯電話</dt>
        <dd>
            <select name="CARRIER">
                <option value="KDDI">KDDI(AU)</option>
                <option value="ツーカー">ツーカー</option>
                <option value="DC" selected="selected">ドコモ</option>
                <option value="JP">ソフトバンク</option>
                <option value="OT">その他</option>
                </select>
            </dd>

        <dt>ご意見</dt>
        <dd><textarea name="MESSAGE" cols="20" rows="4">ご意見をどうぞ。</textarea></dd>
        </dl>

    <ul>
        <li><input type="submit" value=" SEND " /></li>
        <li><input type="reset" value=" RESET " /></li>
        </ul>

    </form>

変換後のWML。

先ほど示したHTMLでのフォームは、以下のように変換されます。

尚、×, △及び◇は、変換時にスクリプトが与える番号となります。

また、実際にはこのように改行や字下げは殆どされる事無く出力されます。

<card id="m----×">
    <onevent type="onenterforward">
        <go href="#m----">
            <setvar name="HOBBY" value="" />
            <setvar name="CNAME" value="" />
            <setvar name="HOBBY0" value="" />
            <setvar name="ADDRESS" value="" />
            <setvar name="CARRIER" value="" />
            <setvar name="PASSWD" value="" />
            <setvar name="TEL" value="" />
            <setvar name="MESSAGE" value="" />
            <setvar name="SEX" value="" />
            <setvar name="HOBBY1" value="" />
            <setvar name="HOBBY2" value="" />
            </go>
        </onevent>
    <onevent type="onenterbackward">
        <prev />
        </onevent>
    </card>

<card title="○○ #○" id="m----">
    <do type="accept" label="SEND">
        <go method="post" href="○○>
            <postfield name="HNAME" value="お名前" />
            <postfield name="PASSWD" value="$PASSWD" />
            <postfield name="SEX" value="$SEX" />
            <postfield name="HOBBY" value="$HOBBY" />
            <postfield name="HOBBY" value="$HOBBY0" />
            <postfield name="HOBBY" value="$HOBBY1" />
            <postfield name="HOBBY" value="$HOBBY2" />
            <postfield name="CARRIER" value="$CARRIER" />
            <postfield name="MESSAGE" value="$MESSAGE" />
            <postfield name="ADDRESS" value="$ADDRESS" />
            <postfield name="TEL" value="$TEL" />
            </go>
        </do>
    <do type="options" label="RESET">
        <go href="#m----×" />
        </do>

    <p>
        <a href="#○○">戻る</a>
        </p>

    <p align="left" mode="wrap">
        <b>お名前</b><br />
        &nbsp;&nbsp;<input type="text" name="CNAME" emptyok="true" value="お名前" format="*M" /><br />

        <b>パスワード</b><br />
        &nbsp;&nbsp;<input type="password" name="PASSWD" emptyok="true" value="" format="*N" /><br />

        <b>性別</b><br />
        &nbsp;&nbsp;<select name="SEX" value="女">
            <option value="男">男性 </option>
            <option value="女">女性 </option>
            <option value="G">法人 </option>
            </select><br />

        <b>ご趣味</b><br />
        パソコン <select name="HOBBY" value="">
            <option value="">いいえ</option>
            <option value="PC">はい</option>
            </select><br />
        スポーツ <select name="HOBBY0" value="">
            <option value="">いいえ</option>
            <option value="SP">はい</option>
            </select><br />
        読書 <select name="HOBBY1" value="読書">
            <option value="読書">はい</option>
            <option value="">いいえ</option>
            </select><br />
        その他 <select name="HOBBY2" value="">
            <option value="">いいえ</option>
            <option value="OT">はい</option>
            </select><br />

        <b>お使いの携帯電話</b><br />
        &nbsp;&nbsp;<select name="CARRIER" value="DC">
            <option value="DC">ドコモ</option>
            <option value="KDDI">KDDI(AU)</option>
            <option value="ツーカー">ツーカー</option>
            <option value="JP">ソフトバンク</option>
            <option value="OT">その他</option>
            </select><br />

        <b>ご意見</b><br />
        &nbsp;&nbsp;<input type="text" name="MESSAGE" emptyok="true" value="ご意見をどうぞ。" /><br />

        <br />
        &nbsp;*SEND は<b>SOFT1</b>を押して下さい<br />
        &nbsp;*RESET は<b>ACCEPT</b>を押して下さい<br />

        <br />
        フォームは以上です。<br />
        </p>

    <p><a href="#m----◇">続き</a></p>
    </card>

基本的に、WML 1.1には<input>要素と<select>要素/<option>要素しか無いため、これらを組合わせて等価的なフォームを実現します。

また、HTMLのフォームとは違って、WMLでは変数(変換後のWMLソース内に見られる、$で始まる英数字)に入力されたテキストを入れて、それをポストする場合には<postfield>要素でクエリ名と変数名を指定する事になります。

加えて、この変数は予め初期化していないと予期せぬ動作を引き起こす事が予想されます。

このため、<setvar>要素で利用する変数をクリアする動作を行なっております。

この変数の初期化には別のカードが必要となり、従って一つのフォームは必ず二枚以上のカードに分割される事になります。


ページ外へのご案内。