アクセスform_group div id

Question

java/coffee-scriptを使用して私のプロファイルモデル用のブートストラップフォームのフィールドの入力に関する即時検証フィードバックを提供するチェックを行いたいと思います。私の現在の解決策は機能していますが、かなり不器用な感じであり、改善したいと思います。

ここに私がしていることのいくつかのコード例があります。

アプリ/ビュー/プロファイル/ _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 %> 

アプリ/資産/ジャバスクリプト/ 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を設定する方法を知っている人はいますか？または、実際にidを適切に配置できるように、HTMLコード全体を実際に書き出す必要がありますか？

Answer 1

これが役に立ちます！

<%= 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 %>