作成日:2018-03-30, 更新日:2022-02-08
基本
下記のときが面倒。
▼登録フォーム等のページ構成
・入力画面
・確認画面
・保存後の完了画面
間に確認画面があると色々と面倒・・・。
▼面倒な状況
・パスワードや、あまり見せたくない情報があるとき
・「新規登録」と「既存データの更新」の「入力画面」を１ファイルでどうにかしたいとき
・ファイルを送信したいとき
・バリデーションしたいとき
対策：ファイルのアップが無いとき
色々と対応策はある。でも、どれがベストなのかが分からない。
hidden属性にする
確認画面では、入力されたデータをhidden属性にする。手っ取り早い方法ではある。
パスワードがあると・・・HTMLソースを見るとわかってしまうので注意が必要。
確認画面なし
一番手っ取り早い方法。
▼ajaxを使ってバリデーションチェックをしてから、form送信。
$.ajax({
〇〇〇
}).done(function(data) {
if ( data.〇〇〇（バリデーションチェックした結果） ) {
// バリデーションでエラーあり
～ エラー出力させる処理 ～
}
else {
// バリデーションでエラーなし
〇〇.submit();
}
}).fail(function(jqXHR, textStatus, errorThrown) {
// 失敗
});
A.入力画面：送信→（ajaxでバリデーションチェック：エラー無し）→form送信。
B.入力画面：送信→（ajaxでバリデーションチェック：エラーあり）→入力画面にエラー
単純にform送信できるので何も気にしなくていい。
入力データに間違いがあると気付いたときは、登録後に更新処理をしてもらうって感じ。
問合せフォームだと・・・ダメな感じ。
セッション利用
確認画面で入力されたデータをセッションに保存させる。
ちと面倒だけど無難な方法。
面倒なのは下記のとき。
・「新規登録」と「既存データの更新」の「入力画面」を１ファイルでどうにかしたいとき
新規登録時、更新時の既存データとセッション保存した入力データなどで、ゴニョゴニョしてあげないと「入力画面」でエラーになる。
jqueryで確認画面を用意する
面倒。
A.入力画面：送信→（ajaxでバリデーションチェック：エラー無し）→確認画面を出力→form送信。
B.入力画面：送信→（ajaxでバリデーションチェック：エラーあり）→入力画面にエラー
入力画面を確認画面に変換が面倒。
inputタグなどを「readonly」にすればいいっていう話ではあるけど・・・チェックボックスなどが面倒。
それに「確認」ボタンを「保存」ボタンに変更したり、「修正」ボタンの表示・非表示も作るのが面倒。
対策：ファイルのアップがあるとき
確認画面を用意するときファイルにセッションは意味がない。
確認画面を用意するときのファイルの処理
１．確認画面でファイルをどこかにアップ。
２．確認画面→データ保存時にアップしたファイルを任意の場所に移動する
注意点
・「確認画面→入力画面」のとき「どこかにアップ」したファイルは削除する必要あり
・「確認画面→ページから離脱」したとき「どこかにアップ」したファイルが残る
対応としては・・・
・cronか何かで定期的に「どこかにアップ」した場所をチェックして「〇日前のファイル」を削除
ajax、jqueryで確認画面を用意する
面倒だけどjqueryで確認画面を用意するのが良さげ。
※javascriptを無効にしているユーザーは・・・対象外。
A.入力画面：送信→（ajaxでバリデーションチェック：エラー無し）→確認画面を出力→form送信。
B.入力画面：送信→（ajaxでバリデーションチェック：エラーあり）→入力画面にエラー
重いファイルのupとform送信
サーバの設定やPHPで一時的にメモリ割り当ての変更がNGの場合。
→重いファイルのupは分割して送信させたい。
１．重いファイルを仮フォルダにup→up成功したら、ファイル名をformにセット
２．form送信時、upされたファイルを任意の場所に移動
ファイルをup後、ブラウザを閉じたりした人たちの対応
・cronで定期的にファイルをチェックして削除
・任意の処理実行時にファイル削除を行う
ファイルのup無し、セッション・確認画面アリのたたき台
