railsで数値を桁区切りしたい時のdelimited

こんにちは!kossyです!



Amazonのレジ無しコンビニがニューヨークにも開店するそうです。
jp.techcrunch.com
日本でもいずれは無人コンビニになるんでしょうが、今すぐにはそうならないのは、
人員コストが導入コストを下回っているからなのでしょうか。

今や10兆円産業のコンビニ業界だけに、その後の動向には目が離せません。







さて、今回は、日本円の値段登録なんかをしたい際に、
自動でカンマで桁区切りを行うように設定するやり方をブログに残したいと思います。

1000円くらいならいいですが、1000000円とかまで桁が増えると、いくらかわかりづらいですよね。
1,000,000円という表示なら多少は見やすくなります。(万使えばよくねってツッコミはやめてね笑)





以下、scaffoldを使った例です。(ruby2.5.1, rails5.1.6で試してます)

$ rails new で適当にアプリを作成

$ cd アプリ名

$ rails g scaffold product name:string price:integer

$ rails db:create

$ rails db:migrate




ヘルパーにメソッドを定義します

app/helpers/products_helper.rb

module ProductsHelper
  def converting_to_jpy(price)
    "#{price.to_s(:delimited, delimiter: ',')}"
  end
end


:delimited等のto_sメソッドのフォーマットについては以下の記事が詳しかったです。
qiita.com





次にindex.html.erbを編集

<p id="notice"><%= notice %></p>

<h1>Products</h1>

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Price</th>
      <th colspan="3"></th>
    </tr>
  </thead>

  <tbody>
    <% @products.each do |product| %>
      <tr>
        <td><%= product.name %></td>
        <td><%= converting_to_jpy(product.price) %></td> <=この行に先ほど定義したメソッドを適用
        <td><%= link_to 'Show', product %></td>
        <td><%= link_to 'Edit', edit_product_path(product) %></td>
        <td><%= link_to 'Destroy', product, method: :delete, data: { confirm: 'Are you sure?' } %></td>
      </tr>
    <% end %>
  </tbody>
</table>

<br>

<%= link_to 'New Product', new_product_path %>


ルーティングを編集します

config/routes.rb

Rails.application.routes.draw do
  root "products#index" <= 追加
  resources :products
end

これで準備完了です。






rails sでサーバーを立ち上げると、下記のような画面になっていると思います。new productをクリックしましょう。
f:id:kossy-web-engineer:20180907235828p:plain


適当に名前と値段を入れ、create productをクリックし、アラートのOKボタンをクリックします。
f:id:kossy-web-engineer:20180908000106p:plain


create productをクリックしたら、以下の画面が表示されると思います。
この段階では数字が成形されていません。(show.html.erbでヘルパーで定義したメソッドを使っていないため)
Backをクリックしてトップ画面に戻りましょう。
f:id:kossy-web-engineer:20180908000235p:plain


以下の画面のように、桁区切りでカンマが表示されていれば成功です。
f:id:kossy-web-engineer:20180908000639p:plain