2011-08-25 67 views
1

目前我想知道爲什麼jQuery驗證器不能在rails上使用下面的代碼:我注意到它適用於text_field標記,但不適用於f.text_field 有誰知道如何使它與f.text_field一起使用?由於Ruby on Rails 3上的jQuery Validator插件?

文檔準備功能

$("#user_signup_form").validate({ 
    rules: { 
    user_username:{ 
    required: true, 
    minlength: 3 
    }, 
    user_email:{ 
    required: true, 
    email: true 
    }, 
    user_password:{ 
    required: true, 
    minlength: 7 
    }, 
    user_password_confirmation:{ 
    required: true, 
    minlength: 7, 
    equalTo: "#user_password" 
    } 
    }, 
    messages: { 
    user_username:{ 
    required: "Required", 
    minlength: "Min Length is 3 characters" 
    }, 
    user_email:{ 
    required: "Required", 
    email: "A valid email address is required" 
    }, 
    user_password:{ 
    required: "Required", 
    minlength: "Min Length is 7 characters" 
    }, 
    user_password_confirmation:{ 
    required: "Required", 
    minlength: "Min Length is 7 characters", 
    equalTo: "New Password Doesn't Match" 
    } 
    } 
    }); 


    <%= form_for(:user, url: signup_path, :html =>{:id => "user_signup_form"}) do |f| %> 
    <% if @user.errors.any? %> 
    <div id="error_explanation"> 
    <h2><%= pluralize(@user.errors.count, "error") %> prohibited this user from being saved:</h2> 
    <ul> 
    <% @user.errors.full_messages.each do |msg| %> 
    <li><%= msg %></li> 
    <% end %> 
    </ul> 
    </div> 
    <% end %> 

    <div class="field"> 
    <%= f.label :username, "Select a username for tingle" %><br /> 
    <%= f.text_field :username %> 
    </div> 

    <div class="field"> 
    <%= f.label :email %><br /> 
    <%= f.text_field :email %> 
    </div> 

    <div class="field"> 
    <%= f.label :password, "Select a password for tingle" %><br /> 
    <%= f.password_field :password %> 
    </div> 

    <div class="field"> 
    <%= f.label :password_confirmation, "Confirm password" %><br /> 
    <%= f.password_field :password_confirmation %> 
    </div> 

    <div class="actions"> 
    <%= f.submit defined?(@button_label)? @button_label : "Signup" %> 
    </div> 
    <% end %> 

回答

3

你需要做的字段的名稱,而不是ID驗證。就像我在下面做的一樣。 首先包含必需的jQuery庫。

<%= javascript_include_tag "jquery-1.6.2.min.js" %> 
<%= javascript_include_tag "jquery.validate.js" %> 


<%= form_for(:user, url => signup_path, :html =>{:id => "user_signup_form"}) do |f| %> 
    <% if @user.errors.any? %> 
     <div id="error_explanation"> 
      <h2><%= pluralize(@user.errors.count, "error") %> prohibited this user from being saved:</h2> 
      <ul> 
      <% @user.errors.full_messages.each do |msg| %> 
       <li><%= msg %></li> 
      <% end %> 
      </ul> 
     </div> 
    <% end %> 

    <div class="field"> 
     <%= f.label :username, "Select a username for tingle" %> 
     <br/> 
     <%= f.text_field :username %> 
    </div> 

    <div class="field"> 
     <%= f.label :email %> 
     <br/> 
     <%= f.text_field :email %> 
    </div> 

    <div class="field"> 
     <%= f.label :password, "Select a password for tingle" %> 
     <br/> 
     <%= f.password_field :password %> 
    </div> 

    <div class="field"> 
     <%= f.label :password_confirmation, "Confirm password" %> 
     <br/> 
     <%= f.password_field :password_confirmation %> 
    </div> 

    <div class="actions"> 
     <%= f.submit defined?(@button_label) ? @button_label : "Signup" %> 
    </div> 
<% end %> 



<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#user_signup_form").validate({ 
      rules: { 
       "user[username]":{ 
        required: true, 
        minlength: 3 
       }, 
       "user[email]":{ 
        required: true, 
        email: true 
       }, 
       "user[password]":{ 
        required: true, 
        minlength: 7 
       }, 
       "user[password_confirmation]":{ 
        required: true, 
        minlength: 7, 
        equalTo: "#user_password" 
       } 
      }, 
      messages: { 
       "user[username]":{ 
        required: "Required", 
        minlength: "Min Length is 3 characters" 
       }, 
       "user[email]":{ 
        required: "Required", 
        email: "A valid email address is required" 
       }, 
       "user[password]":{ 
        required: "Required", 
        minlength: "Min Length is 7 characters" 
       }, 
       "user[password_confirmation]":{ 
        required: "Required", 
        minlength: "Min Length is 7 characters", 
        equalTo: "New Password Doesn't Match" 
       } 
      } 
     }); 
    }); 
</script> 
+0

謝謝:)它的工作原理 – tingly

+0

謝謝:)它可以幫助我。 –

+0

它工作正常,但它沒有與嵌套屬性字段的任何線索爲什麼? – vishB