2011-01-05 62 views
0

我的Rails表單代碼如下:如何獲得jQuery驗證以使用Rails 3?

<%= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %> 
     <%= f.text_field :f_name, :value => "First Name", :class => "clearField curved" %><br /> 
     <%= f.text_field :l_name, :value => "Last Name", :class => "clearField curved" %><br /> 
     <%= f.text_field :username, :value => "Username", :class => "clearField curved" %><br /> 
     <%= f.password_field :password, :value => "Password", :class => "clearField curved" %><br /> 
     <%= f.password_field :password_confirmation, :value => "Password", :class => "clearField curved" %><br /> 
     <%= f.text_field :email, :value => "Email Address", :class => "clearField curved" %><br /> 

    <div id="login_buttons"> 
     <%= f.submit "Sign in", :id => "login", :value => "Submit", :class => "curved" %> 
     <%= f.submit "Sign in", :id => "register", :value => "Register", :class => "curved" %> 
     <%= f.submit "Send Reset Instructions", :id => "pass-reset", :value => "Send Reset Instructions", :class => "curved"%> 
     <a href="#" id="forgot-pw">Forgot pass?</a> 
    </div> 

<% end %> 

當頁面加載的第一次會發生什麼時,用戶只能看到用戶名&密碼字段。一旦他們按下「註冊」,他們就會看到其他字段。所以我想要做的是對這兩個狀態進行表單驗證。登錄狀態(只有用戶名&密碼)和註冊狀態(包含所有字段)。

產生的HTML輸出如下:

<form accept-charset="UTF-8" action="https://stackoverflow.com/users/login" class="user_new" id="user_new" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="5B04HFtyauEPUigmXrIhi2jYvHJv47gvIgUbx64QQ0E=" /></div> 
     <input class="clearField curved" id="user_f_name" name="user[f_name]" size="30" type="text" value="First Name" /><br /> 
     <input class="clearField curved" id="user_l_name" name="user[l_name]" size="30" type="text" value="Last Name" /><br /> 
     <input class="clearField curved" id="user_username" name="user[username]" size="30" type="text" value="Username" /><br /> 
     <input class="clearField curved" id="user_password" name="user[password]" size="30" type="password" value="Password" /><br /> 
     <input class="clearField curved" id="user_password_confirmation" name="user[password_confirmation]" size="30" type="password" value="Password" /><br /> 
     <input class="clearField curved" id="user_email" name="user[email]" size="30" type="text" value="Email Address" /><br /> 

    <div id="login_buttons"> 
     <input class="curved" id="login" name="commit" type="submit" value="Submit" /> 
     <input class="curved" id="register" name="commit" type="submit" value="Register" /> 
     <input class="curved" id="pass-reset" name="commit" type="submit" value="Send Reset Instructions" /> 
     <a href="#" id="forgot-pw">Forgot pass?</a> 
    </div> 

我嘗試以下,但它沒有工作:

$('#user_new').validate({ 
    debug: true, 
    rules: { 
     user_username: "required", 
     user_email: { 
      required: true, 
      email: true 
     } 
    }, 
    messages: { 
     user_username: "Please specify your name", 
     user_email: { 
      required: "We need your email address to contact you", 
      email: "Your email address must be in the format of [email protected]" 
     } 
    } 
}); 

所以會喜歡上的任何建議我怎麼能讓這個去吧。

編輯1:任何想法或可能的解決方案?

回答