【結論】
・フォームに途中まで入力を行っていても、ブラウザを閉じたりページ遷移してしまうと、入力情報が消えてしまい、再度入力する手間が発生してしまう
・「Garlic.js」を導入すると、フォームに入力途中でページ遷移したとしても、入力情報が保持される
・実装方法は、「Garlic.js」の導入とformのタグを修正するだけで非常にシンプル。入力情報はブラウザのローカルストレージに保持される
【目次】
【本題】
フォームの入力情報が消える問題
会員登録や注文画面などで、フォームの入力途中に、間違ってブラウザを閉じたり、ページを遷移してしまったことで、途中まで入力した情報が全て消えてしまい、再度入力しなければならなくなったという経験は、多くの方がされていると思います。
WEB上の通信は、サーバーの負荷軽減やセキュリティ対策などの観点で、基本的にステートレス（状態やデータを保持しない）で行われている為に、この様な問題が発生します。
項目数が多かったり、住所など確認をしないと入力できない内容などだと、入力に時間を要するので、この様なリスクが発生する可能性は高まります。
せっかく時間を掛けて入力した内容が消えたとなると、かなりの徒労感を与えてしまい、最悪ユーザーの離脱にも繋がりかねません。
こういった問題を防ぐ手段の一つが、今回紹介する「Garlic.js」です。
Garlic.jsについて
Garlic.jsは、フォームが送信されるまで、フォームのテキストを自動的に保持してくれるjQueryのプラグインです。
誤ってタブやブラウザを閉じたり、ページ遷移したとしても、途中まで入力したところから入力を再開する事ができます。
導入方法（Rails）
Railsで導入する場合は、まずjQueryを導入する必要があります。
#gem.file gem "jquery-rails"
#applicationn.js //= require jquery //= require jquery_ujs //= require_tree .
次に以下の公式からgarlic.jsファイルをダウンロードして、配置します。
そして値を保持したいフォームの属性にdata-persist="garlic"を設定します。
なお、Hamlでは、ハッシュのキーをシンボルにする場合、-(ハイフン）が使えないので、data: { persist: 'garlic' }という様にハッシュを階層化して記述する必要があります。
= form_with(model: [post, post_comment], local: true, data: { persist: 'garlic' }) do |f|
●実装前
●実装後
参考情報
フォームの入力内容を保存してくれる「Garlic.js」は便利なプラグイン | 無料パソコン教室PcSchool.Club
《今日の学習進捗（3年以内に10000時間に向けて）》
障害対応でてんやわんや・・・何も上手く出来ない・・・
学習開始からの期間 ：223日
今日までの合計時間：2141h
一日あたりの平均学習時間：9.7h
今日までに到達すべき目標時間：2037h
目標との解離：104h
「10,000時間」まで、
残り・・・「7859時間！」