Question

我想执行一项检查，使用java / coffee-script为我的Profiles模型的bootstrap表单中的字段输入提供即时验证反馈。我目前的解决方案是工作，但感觉相当笨重，我想改进它。

以下是我正在做的一些代码示例。

应用程序/视图/简档/ _form：

<%= bootstrap_form_for(@profile, layout: :horizontal, html: {id: "profile-form"} ) do |f| %>
    <%= f.text_field :name %>
    <%= f.text_field :number, id: "number-field" %> //Field to check
    <%= form_group do %>
        <%= f.primary %>
    <% end %>
<% end %>

应用程序/资产/ JavaScript的/ profile_number_control.coffee：

$(document).on 'ready page:load', ->
  $field = $("#number-field")
  $group = document.getElementById("profile-form").childNodes[5]
  numberPattern = "^(19|20)[0-9]{6}-[0-9]{4}$"
  $helpBlock = $group.getElementsByClassName("help-block")[0]

  $field.keyup ->
    //This works fine, just wanted to show what is going on
    if inputIsValid()
      set $group class to " has-success"         
      set $helpBlock message to successful
    else 
      set $group class to " has-error"
      set $helpBlock message to corresponding error message

这是问题所在。我希望这个脚本适用于profile＃new和profile＃edit，但由于document.getElementById("profile-form").childNodes给出的元素数组长度因当前视图而异，所以我不能使用相同的索引（示例中为5） #new和#update。

有谁知道如何在我的视图中为该特定form_group设置ID？或者我是否必须实际写出整个html代码才能正确放置id？

Answer 1

这可能会有所帮助！

＆＃13;

<%= bootstrap_form_for(@profile, layout: :horizontal, html: {id: "profile-form"} ) do |f| %>
    <%= f.text_field :name %>
    <%= f.text_field :number, :input_html => { id: "number-field" } %> //Field to check
    <%= form_group do %>
        <%= f.primary %>
    <% end %>
<% end %>

＆＃13;

通过ID

1 个答案: