如何将number_field分成3个部分？

Question

在这个模型中，我为phone设置了一个整型字段。在视图中，此字段显示如下：

<%= f.number_field :phone %>

我正在尝试将电话号码的这一个输入显示为3个输入，我想在视图中提供给用户如下所示：

___ - ___ - ____

有没有办法做到这一点？

Answer 1

jQuery Masked Input插件在一个输入字段中提供此功能：

它允许用户更容易地输入固定宽度的输入，您希望他们输入特定格式的数据(日期、电话号码等)。

演示页面包含一个电话格式示例：(___) ___-____

Answer 2

要做到这一点，一种方法是在视图中创建3个字段，让用户在3个单独的部分中输入数字。在视图中，它看起来像这样

<p><%= f.number_field_tag "area_code" %> - 
<%= f.number_field_tag "phone1" %> - 
<%= f.number_field_tag "phone2" %> </p>

在控制器中，您将把这3个字符串合并为1个字符串，以便能够根据您的模型设置保存它

def create_user
...
@user = User.new
@user.phone_number = params[:area_code].to_s + params[:phone1].to_s + params[:phone2].to_s
...
end

我还建议将电话号码保存为模型中的字符串，以避免错误地存储以0开头的数字。