rails 4.1.6 form_for coffeescript多个视图无法正常工作

时间:2015-03-22 01:33:16

标签: javascript ruby-on-rails coffeescript submit form-for

我可以通过一个视图显示我的coffeescript错误消息(/users/new.html.erb):

<h1> Sign up! </h1>
<%= form_for (@user) do |f| %>
  <%= f.label :email %><p class="error email-error"></p>
  <%= f.email_field :email %>       

  <%= f.submit "Sign Up", class: 'btn' %>   
<% end %>

和一个coffeescript文件(/users.js.coffee):

ready = ->
  $('form').submit ->

    $('.error').text ''    
    email = $('#user_email').val()

    if email == ''
      $('.email-error').text 'Please enter your email.'

    false
  return

$(document).ready(ready)
$(document).on('page:load', ready)

但是当我尝试添加第二个视图(/sessions/new.html.erb)时,两个表单的错误消息都不会显示:

<h1> Log In </h1>
<%= form_for(:session, url: login_path) do |f| %>
  <%= f.label :email %><p class="error email-error"></p>
  <%= f.email_field :email, :id => "session_email" %>

  <%= f.submit "Log In", class: 'btn' %>    
<% end %>

和coffeescript文件(/sessions/js.coffee):

main = ->

  $('form').submit ->

    $('.error').text ''    
    email = $('#session_email').val()

    if email == ''
      $('.email-error').text 'Please enter your email'

    false
  return

$(document).ready(main)
$(document).on('page:load', main)

我知道最终coffeescript会被rails编译成一个文件,所以它不会知道我引用的是哪种'形式'。但是当我尝试在表单中添加id标签时,我甚至无法获得一个表单。我已经被困2天了,无法解决这个问题。任何帮助将不胜感激。谢谢!

1 个答案:

答案 0 :(得分:0)

在“mu太短”的帮助下,我能够在两个表单上显示错误消息。问题是.submit()绑定到一个表单并阻止它绑定到第二个表单。添加.unbind()修复了这个问题:

ready = ->
  $('form.new_user').submit ->

    $('.error').text ''    
    email = $('#user_email').val()

    if email == ''
      $('.email-error').text 'Please enter your email.'

    $('form').unbind('submit')  
    false
  return

$(document).ready(ready)
$(document).on('page:load', ready)

和第二个coffeescript文件:

main = ->

  $('form.s_login').submit ->

    $('.error').text ''    
    s_email = $('#session_email').val()

    if s_email == ''
      $('.email-error').text 'Please enter your email'

    $('form').unbind('submit')  
    false
  return

$(document).ready(main)
$(document).on('page:load', main)