Feature / Form 05

FW JS 管理側 公開側

形式チェック

メール、電話番号、日付、金額、URLなどの入力形式を保存前に確認します。

形式チェックは、入力されている値が業務で扱える形になっているかを確認する機能です。Roundtableでは「どの項目にどの形式を求めるか」「間違いをどこで止めるか」「自動整形するか、エラーとして返すか」を言葉にしておくと、発注者、実装者、AIに指示する人の認識を合わせやすくなります。

取引先登録フォームでメール、電話番号、日付、金額、URLの形式エラーを表示している業務画面例

この機能でできること

メールアドレス、電話番号、郵便番号、日付、時刻、金額、数量、URL、会員番号などが、決めた形式に合っているかを確認できます。形式が違う場合は保存や送信を止め、どの項目を直す必要があるかを表示します。管理側の登録編集、公開申込、問い合わせ、予約、請求、外部連携前の入力確認などで使えます。

入力されているかだけでなく、業務処理に使える形かを確認します。 形式をそろえると、メール送信、電話連絡、集計、請求、外部API連携、CSV出力で後から補正する手間を減らせます。

よくある利用場面

連絡先を登録する メールアドレス、電話番号、郵便番号を確認し、通知や連絡に使えない値を保存前に止めます。
予約・請求・支払い情報を入力する 日付、時刻、金額、数量、税率などを決めた形式で受け取り、集計や帳票へつなげやすくします。
URLや管理番号を扱う WebサイトURL、申請番号、会員番号、商品コードなどをルールに合わせて入力させ、検索や外部連携の失敗を防ぎます。

プロンプト例

対象項目、求める形式、許可する表記ゆれ、自動整形の有無、エラー文言、管理側と公開側の適用範囲をセットで伝えると、実装範囲を決めやすくなります。

プロンプト 取引先登録フォームに形式チェックを追加してください。メールアドレスはメール形式、電話番号は数字とハイフン、契約開始日は日付形式、月額費用は0以上の金額、WebサイトURLはURL形式にしてください。形式が違う場合は保存せず、項目の近くに修正メッセージを表示してください。公開申込フォームでも同じチェックを使ってください。

この機能を使うときのポイント

許可する表記電話番号のハイフン有無、金額のカンマ、URLの http/https など、許可する表記を先に決めます。
自動整形の範囲全角数字を半角へ直す、金額のカンマを外すなど、保存前に整えるかエラーにするかを分けます。
エラーの見せ方「形式が違います」だけでなく、入力例を添えると利用者が修正しやすくなります。
外部連携との関係メール送信、決済、配送、予約連携など、後続処理が求める形式に合わせます。

この機能を実装するときのコツ

形式チェックは、入力欄の type や画面側の補助だけに頼らず、保存処理側でも必ず確認します。管理側の標準画面では項目型や保存前チェックを使い、公開ページや独自フォームでは POST 値を受けた関数で形式を検証してエラーを返します。日付や金額のように表示形式と保存形式が違う項目は、入力値を保存用の値へ変換するタイミングを決めておくと、一覧表示、CSV、PDF、外部API連携で扱いやすくなります。