Javascript Rails合并表单字段

我有一个Rails 3.2.18应用程序，我在其中对模型执行简单的创建/更新操作

有一个叫做sms的字段，我使用ActionMailer以2812222222@vtext.com. 目前，我手动输入这是好的，但我希望其他人能够输入一个电话号码，选择一个运营商，并有这两个项目合并成正确的格式在短信字段再次2812222222@vtext.com. 这使得它比必须背诵完整的sms到电子邮件地址更方便用户

我想我可以通过JS/JQuery完成大部分工作，但我不确定如何开始

我希望他们能够以281-555-4444格式输入电话号码，并让运营商选择Tmobile、Verizon等的下拉列表，替换为@tmomail.net、@vtext.com等，去掉regex电话号码并将其与运营商@vtext.com合并到sms字段中

如果有人能直接给我指出正确的方向，我将不胜感激

更新：

我想我可以使用助手方法来定义载体：

def phone_carriers
{
  "All Tell" => "@message.alltel.com",
  "AT&T" => "@txt.att.net",
  "Boost" => "@myboostmobile.com",
  "Cellular South" => "@csouth1.com",
  "Centennial Wireless" => "@cwemail.com",
  "Cincinnati Bell" => "@gocbw.com",
  "Cricket Wireless" => "@sms.mycricket.com",
  "Metro PCS" => "@mymetropcs.com",
  "Powertel" => "@ptel.net",
  "Qwest" => "@qwestmp.com",
  "Rogers" => "@pcs.rogers.com",
  "Sprint" => "@messaging.sprintpcs.com",
  "Suncom" => "@tms.suncom.com",
  "T-Mobile" => "@tmomail.net",
  "Telus" => "@msg.telus.com",
  "U.S. Cellular" => "@email.uscc.net",
  "Verizon" => "@vtext.com",
  "Virgin Mobile USA" => "@vmobl.com"
}

结束

将attr_accessor:carrier添加到人物模型

然后在表单中执行以下操作：

<%= f.input :phone, placeholder: "555-555-5555", required: true, input_html: {required: true} %>

<%= f.select :carrier, phone_carriers.map{ |k, v| [k, v] }, {include_blank: true}, {placeholder: "Select your phone carrier", class: "select2"} %>

---

但是我仍然无法弄清楚如何将电话号码剥离到5555，并将：phone字段与：carrier对象合并到：sms字段中。如果使用标准javascript字符串库，最好是客户端

function prepare(str){
  str2 = str.replace("(","").replace(")","").replace("-","")
  carrier = getCarrier //assuming this implemented by you somewhere 
  return (st2.concat(carrier))
}

---

在做了大量的研究和突破之后，我想出了以下方法来实现这一目标。模型和表单只显示我所做的更改，而不是完整的表单或模型

形式

咖啡脚本

$ ->
  $("#person_carrier").on "change", update_sms_address
  $("#person_phone").on "keyup", update_sms_address
  update_sms_address

update_sms_address = ->
    digits  = $("#person_phone").val().match(/\d+/g)
    phone   = digits.join("") if digits
    carrier = $("#person_carrier").val()

    if phone? && phone.length == 10 && carrier
      sms = phone + carrier
      $("#person_sms").val(sms)
      $("#person-sms-number").html(sms)
    else if !carrier
      $("#person_sms").val("")
      $("#person-sms-number").html("Choose a carrier to receive SMS notifications")
    else
      $("#person_sms").val("")
      $("#person-sms-number").html("Invalid phone number")

当以281-444-4444格式输入电话号码时，这似乎起作用，因为它会将号码向下剥离，并将其与载波阵列中的值合并，并适当设置隐藏：sms字段

我现在唯一的问题是，因为我正在为承运人使用虚拟属性，如果我再次编辑此人，它不会保留承运人选择并将其保留为空。如果我提交表单而不更改任何信息，它将保留：sms字段，但可能会混淆，因为：carrier不是数据库记住的实际字段，而是虚拟属性

---

有没有更好的方法来实现这一点？

我首先要创建一个carriers表：

rails generate model Carrier name:string email_domain:string

并通过向迁移中添加以下内容在Person模型中引用它：

change_table :people do |t|
  t.references :carrier
end
add_index :people, :carrier_id

以下内容适用于您的人员模型：

belongs_to :carrier
validates_presence_of :carrier

def sms
  carrier ? "#{phone}@#{carrier.email_domain}"
end
def phone_with_dashes
  "#{phone[0..2]}-#{phone[3..5]}-#{phone[6..9]}"
end
def phone_with_dashes=(_phone_with_dashes)
  self.phone = _phone_with_dashes.gsub(/-/ ,'')
end

现在，您的视图我将把格式留给您：

Phone: <%= f.phone_field :phone_with_dashes %>
Carrier: <%= f.collection_select :carrier_id, Carrier.all, :id, :name %>
<div id='person-sms-number'>
  <%= f.object.sms %>
</div>

---

最后，Coffeescript：这里唯一需要改变的是，您不再需要“person\u sms”输入，因为您不再直接保存值，而是从其他字段动态生成值。

我想它可以工作。但我真的需要弄清楚，如何不仅去掉任何格式的数字，而且将其与载波字段连接起来，并通过JS/Jquery自动填充sms字段。为什么载波不是一个持久化字段？如果您下次需要记住它，请为它创建一个数据库列。此外，由于person.carrier为空，所以carrier字段为空。它返回默认值@carrier。如果定义它，该字段将显示该方法返回的任何内容：def carrier；短信拆分“@”[1]；终止您甚至可能希望在after_find块中执行此操作，因此只需计算一次：after_find do@运营商=短信。拆分“@”[1]；终止

belongs_to :carrier
validates_presence_of :carrier

def sms
  carrier ? "#{phone}@#{carrier.email_domain}"
end
def phone_with_dashes
  "#{phone[0..2]}-#{phone[3..5]}-#{phone[6..9]}"
end
def phone_with_dashes=(_phone_with_dashes)
  self.phone = _phone_with_dashes.gsub(/-/ ,'')
end

Phone: <%= f.phone_field :phone_with_dashes %>
Carrier: <%= f.collection_select :carrier_id, Carrier.all, :id, :name %>
<div id='person-sms-number'>
  <%= f.object.sms %>
</div>