16-1. JavascriptとPHPによる検証とエラー処理①
16章いきまーす。
17章以降はCSSなので、16章と放置していた分を終わらすと一旦リス終了です。。。
がんばろ。
16章は、PHPとjavascriptの基礎を勉強してきたので、これらを連携させたwebフォームの作成方法を見ていきます。
PHPを使ってフォームを作り、送信するデータを完全で正しいものにするためにJavascriptを使ってクライアントサイドでの検証を実行します。入力の最終的な検証はそのあとPHPプログラムで行い必要な場合には、ユーザーに修正をうながすフォームを再表示します。
1-1. Javascriptを使ったユーザー入力の検証
Javascriptによる検証はwebサイトに向けたものではなく、あくまでもユーザーに対する支援と捉えるべきと。リスが。
理由としては、サーバーに送られて来るデータはjavascrip1tによる検証がサポートされていたとしても、信用できるものではないからです。また、入力検証を実行するJavascriptに全面的に依存できない理由には、javascriptを無効にしているユーザーや、サポートしないブラウザを使っている人が存在することもあります。
Javascriptを使った最良の検証は、
・フォームのフィールドが空でないかどうか調べる
・メールアドレスが適切な形式にしたがっているか
・入力された値が適切な範囲に収まっているかどうかを確認する
などで使用します。
1-2. サインアップフォームの作成
まずは、会員や登録ユーザー向けに使用されている、一般的なサインアップフォームを作成します。
ここで求める入力は、以下です。
・forename（名前）
・surname（名字）
・username（ユーザー名）
・password（パスワード）
・age（年齢）
・emailadress（メールアドレス）
コードは以下。
scriptのタグ間には、「validate」という名前の関数が1つあります。この関数自体は、フォームの各入力フィールドを検証する6つの関数を呼び出します。この6つの関数はそれぞれ、フィールドに妥当な値が入力されている場合には空のストリングを返し、そうでない場合にはエラーメッセージを返します。
入力に誤りがある場合には、スクリプトの最後で警告ボックスをポップアップさせ、その誤りを表示します。
「validate」関数は、妥当性が確認された場合はtrue、そうでない場合はfalseを返します。
そして以下が出力されます。
きょうはいじょーーーー。。。。
ｈｈｈｈ
