お問い合わせフォームといえば、郵便番号を入力すると自動的に住所が入るのありますよね。あれを対応してみます。
住所自動入力のライブラリはいくつかあるようです。
http://d.hatena.ne.jp/deeeki/20111006/zip_address_ajax_api
今回はajaxzip3を使ってみます。
詳しい使い方はこちらに載っています。
https://github.com/ajaxzip3/ajaxzip3.github.io
読み込み方は簡単
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>
を設置するだけです。
全ページ読み込んでも問題なさそうなので、
app/views/layouts/application.html.erb
に追記してみました。
https://github.com/YoshiteruIwasaki/banana-mail/commit/be2e738c0001f2ee6004852dfa049f948893d8a7#diff-9599427925097c3c66f26ac1e0de5cadR13
次にこのAjaxの呼び方ですが、
app/views/inquiries/_form.html.erb
<%= f.text_field :zip, "onKeyUp" => "AjaxZip3.zip2addr(this,'','inquiry[prefecture]','inquiry[address1]')"
のように郵便番号入力欄のonKeyUpイベントとして呼び出します。
また、Ruby On Railsで都道府県をよろしく扱うgemファイルを公開してくださる方がいるので、今回はこれを使います。
http://avosalmon.hatenablog.com/entry/2014/05/17/%E3%80%90Rails%E3%80%91%E9%83%BD%E9%81%93%E5%BA%9C%E7%9C%8C%E3%82%92%E6%89%B1%E3%81%86gem
都道府県はデータベースに入れたり、自分で配列に入れたりする事が多いかと思いますが、その手間が減ります。
Gemfileに以下を追記します。
gem 'jp_prefecture'
インストールします。
gem install jp_prefecture
使えるようにします。
config/application.rb
require 'jp_prefecture'
都道府県のプルダウンをセットします。
app/views/inquiries/_form.html.erb
<%= f.collection_select :prefecture, JpPrefecture::Prefecture.all, :code, :name %>
ちなみにajaxzip3では北海道のコードは01になりますが、JpPrefectureでは1になるので、そのへんでちょっと問題が起きます。
解決方法については改めて考えることにします。
やった内容がこちら
https://github.com/YoshiteruIwasaki/banana-mail/commit/be2e738c0001f2ee6004852dfa049f948893d8a7#diff-9599427925097c3c66f26ac1e0de5cadR13
