2011-08-25 49 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