2012年10月28日

CGIで携帯電話用のformを作るときの注意

 今、メールフォームを作っていますが、携帯電話用の「送信」・・・つまり一番最後でつまずきました。
 「送信」ボタンを押すと、送信されずに前の画面に戻ってしまうのです。半日それで潰しました。

 でも、すばらしい記述がありました。

form_au.gif


http://ameblo.jp/hiro628/entry-10506035389.html

 ありがとうございます。>ブログ主さん

 まさに、私の置かれている状況を100%、記述してくれています。
 これはauが悪いんじゃないですよね。

<form>
<table>
</form>
</table>

 これは携帯サイトに限らず、ダメ!です。
 でも・・・<form>については、<table>との組み合わせで使いたくなってしまうのです。
 見やすくし、入力をしやすくするため、入力項目を整然と並べ、背景色も使いたいわけです。
 でも、送信できなければ元も子もないので、<table>タグ(<tr><td>)は全部取り外しました。

 さあ、これで送信できるはず・・・と思ったのですが、また、元のページへ戻ってしまいます。

 実は、次のような記述を残していました。

<script type="text/javascript">
<!--
document.write ('<form style="margin-left:3em;" action="xxxx" method="post">');
// -->
</script>

<noscript><form action="xxxx" method="post"></noscript>

 つまり、画面の広いパソコンでは左側を3emあけ、画面の狭い携帯電話では、左側に寄せることを、JavaScriptの使えるPCと使えない携帯電話とで振り分けたわけです。(JavaScriptを無効にしてあるPCも左に寄ってしまうが、表示される内容は変わらないので構わないことにしました。)

 <noscript>って、「無いものとして扱う」と思い込んでいましたが、これも

<noscript>
<form action="xxxx" method="post">
</noscript>


といことになるので、「タグが交錯して、入れ子になっていない」という解釈なのでしょう。それも、ごもっともです。

 で、<noscript>のタグをはずすと・・・めでたし、めでたし。ちゃんと送信しました。

 私の携帯電話がAUだったのでここまでに苦労をしましたが、逆に言うと、AUの携帯電話のくせについて知る事ができて、公開してから「送信できない」と苦情を受けるよりも遙かによいことでした。

--- 追記 ----------
 ちょっと誤解をしていたのですが、<form></form>がちゃんと入れ子になってれいば、<input>などを<td></td>などで挟むのは問題ないことが分かりました。これにより、フォームをテーブルを使った線で囲んだり、入力欄を色分けしたりすることも可能です。


posted by kewpie at 20:44| Comment(0) | TrackBack(0) | ファイル作成
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
この記事へのトラックバックURL
http://blog.sakura.ne.jp/tb/59611626
※ブログオーナーが承認したトラックバックのみ表示されます。
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック
コメントの投稿について
○お名前とコメント欄の記入は必須です。
○メールアドレスは任意です。記入されても公開はされません。管理人のみに知らされます。
○スパム防止のため、
・ホームページアドレス欄への記入はできません。
・コメント欄にURLは記入できません。
・スパムと思われる語を記入できません。
 これらをしようとすると、最終的に投稿完了できません。
○投稿完了後に、管理人の判断でスパムと判断した投稿は削除させていただきます。