フォームメールの改良(1)

　唐突にjavascriptネタです。　別に特に新しい技でもなんでもありませんが、自分の備忘のために二回連続で残しておきます。　いや、ほんと、こうでもしておかないと本当に忘れちゃうのだよ...
　
　私の関係しているオリジナルサイトでのフォームメールは、かれこれ十年くらい使い回しているperlで書かれたcgiを使い回しています。　cgiである理由というのは唯一、たまにphpが使えないだとか、指定される仕様がややこしかったりした場合のための保険だった時代があったからです。
　とはいえ、「無事動いているものは下手に触るな」という保守的な理由で、それがずっと生きているという、まぁ、よぼよぼっとしたサイトによくある話です。
　
　さて、htmlからsubmitされたデータはcgiである別ファイルに渡ります。　今どきですので、入力データが抜けていたり、あるいは全角半角指定が間違っていたりするとチェックする行も書いてあります。　ということは、そこでエラーが見つかった場合、訂正のためには一つ前の（フォームが書かれている）htmlファイルに戻ることになります。　となると、多くのwebアプ制作者の頭を悩ませる、一度入力したデータが戻ったフォームから消えている、という悲劇が待ち受けているわけです。
　私の場合はWin7のChromeではっきりしているのですが、他人の環境でチェックすると問題ないのもあったりして、実に悩ましい。　データ書き戻しのコードを書けよ、という声は頭の中に響けども、そこまでしている時間が今回はない、との言い訳で、結局手直しに終ります。

　今回は送信直前の内容確認と送信をcgiに任せ、それ以前のフィールドチェックは別のjavascriptに移すことにしました。　つまり、品の悪い書き方をすると、cgiに渡す直前でjavascriptが寸止めに介入させます。　そうすると、フィールドデータに問題がある限りはhtmlに留まるわけで、どんなブラウザであってもデータが消えることはあり得ません。
　
　このためのキーワードは　「onsubmit="return function名()"」。
　これをFORM文中に入れておくことで、submitボタンがクリックされてaction先に飛ぶ前に　function名を宣言したjavascriptにコントロールが移り、フィールドチェックを行う流れです。
　キモは"return"。　これがあるが故にjavascripから"return false"が返ってくると以後action先には飛ばずにその場で留まります。　逆に入力内容に問題が無く、"return true"が返って来れば目出たくaction先に遷移するわけです。

　なんてのがネットからの受け売りな訳ですが、このjavascript、万が一文法エラーがあったらブラウザから完全スルーされてしまい、デバッグが難しくなります。　コンソールにメッセージを出すって言うのもありますが、とりあえず今回は一歩一歩のろのろと試行錯誤の繰り返し。　いつものごとく結果オーライです。
　
　さて、ネット上を探してもはっきりとは出てこなかったフォームからのボタンバリューとjavascriptとの相性の話と解決法はその2へ続く...