如何在Rails表单中将专属字段值拼接后赋值给模型属性？

嘿，当然有其他更灵活的方案啦！除了在模型里加attr_accessor，你完全可以把这两个拆分的输入字段限定在表单/控制器层面处理，不用改动模型的核心属性，下面给你几个实用的思路：

方案1：控制器层面处理参数拼接 #

这个方案最直接，不用给模型加任何额外属性，完全靠表单和控制器完成拼接：

第一步：编写表单 #

在form_for里直接添加两个独立的输入框，指定它们的name属性让参数能被控制器接收：

<%= form_for @user do |f| %>
  <%= f.label :dialing_code, "区号" %>
  <%= f.text_field :dialing_code, name: "user[dialing_code]" %>

  <%= f.label :number, "号码" %>
  <%= f.text_field :number, name: "user[number]" %>

  <%= f.submit "保存" %>
<% end %>

第二步：控制器处理参数 #

首先在强参数里允许这两个字段，然后在创建/更新动作里把它们拼接成phone_number：

def create
  @user = User.new(user_params)
  # 拼接区号和号码为完整手机号
  @user.phone_number = "#{user_params[:dialing_code]}#{user_params[:number]}"

  if @user.save
    redirect_to @user, notice: "用户创建成功！"
  else
    # 验证失败时，把输入的区号和号码赋值给实例，用于表单回显
    @user.dialing_code = user_params[:dialing_code]
    @user.number = user_params[:number]
    render :new
  end
end

private

def user_params
  params.require(:user).permit(:dialing_code, :number, :name, :email) # 加上你需要的其他属性
end

这里注意，验证失败时要手动把dialing_code和number赋值给@user实例，不然表单回显时这两个输入框会是空的——因为模型本身没有这两个属性，没法自动保存临时值。

方案2：用表单对象（Form Object）封装逻辑 #

如果你的业务逻辑比较复杂（比如要加区号/号码的验证规则），推荐用表单对象把表单相关逻辑从模型里抽离出来，保持模型的单一职责：

第一步：创建表单对象 #

在app/forms目录下新建user_form.rb：

class UserForm
  include ActiveModel::Model

  # 定义表单需要的属性，包括拆分的区号、号码，以及User模型的其他属性
  attr_accessor :dialing_code, :number, :name, :email

  # 给表单字段加验证
  validates :dialing_code, :number, presence: true
  validates :dialing_code, format: { with: /\A\+\d{1,3}\z/, message: "格式不正确，比如+86" }

  def save
    return false unless valid?
    # 拼接号码后创建User记录
    User.create(user_attributes)
  end

  private

  def user_attributes
    # 去掉表单特有的字段，把拼接好的phone_number加进去
    attributes.except(:dialing_code, :number).merge(
      phone_number: "#{dialing_code}#{number}"
    )
  end
end

第二步：修改控制器 #

把原来的@user换成@user_form：

def new
  @user_form = UserForm.new
end

def create
  @user_form = UserForm.new(user_form_params)
  if @user_form.save
    user = User.last # 或者在表单对象里返回创建的user
    redirect_to user, notice: "用户创建成功！"
  else
    render :new
  end
end

private

def user_form_params
  params.require(:user_form).permit(:dialing_code, :number, :name, :email)
end

第三步：修改表单 #

表单绑定到@user_form即可：

<%= form_for @user_form do |f| %>
  <%= f.label :dialing_code, "区号" %>
  <%= f.text_field :dialing_code %>

  <%= f.label :number, "号码" %>
  <%= f.text_field :number %>

  <%= f.label :name, "姓名" %>
  <%= f.text_field :name %>

  <%= f.submit "保存" %>
<% end %>

这个方案的好处是：表单的验证、字段拼接逻辑都集中在表单对象里，User模型只需要关心phone_number这一个属性，代码更清晰易维护。

方案3：前端JavaScript拼接（仅作为辅助） #

你也可以在前端用JS把两个输入框的值实时拼接成隐藏字段，提交时只传phone_number，但不推荐单独使用（因为用户可能禁用JS，或者存在恶意提交的风险）：

<%= form_for @user do |f| %>
  <%= f.label :dialing_code, "区号" %>
  <%= f.text_field :dialing_code, id: "dialing_code" %>

  <%= f.label :number, "号码" %>
  <%= f.text_field :number, id: "number" %>

  <%# 隐藏字段用于存储拼接后的完整手机号 %>
  <%= f.hidden_field :phone_number, id: "phone_number" %>

  <%= f.submit "保存" %>
<% end %>

<script>
  const dialingCode = document.getElementById('dialing_code');
  const number = document.getElementById('number');
  const phoneNumber = document.getElementById('phone_number');

  // 实时更新隐藏字段的值
  function updatePhoneNumber() {
    phoneNumber.value = dialingCode.value.trim() + number.value.trim();
  }

  dialingCode.addEventListener('input', updatePhoneNumber);
  number.addEventListener('input', updatePhoneNumber);
</script>

如果用这个方案，后端还是要做phone_number的格式验证，不能完全依赖前端。

内容的提问来源于stack exchange，提问作者abc def