Question

我正在尝试使用rails 3实现ajaxy注册。我正在使用jquery-ujs和远程表单。我使用$.get请求访问注册表单，并且显示正确。此注册表单是远程的：

form_for @user, :remote => true, :html => {"data-type" => "html"} do |f|

在我的application.js中，如果获取表单的ajax请求成功，我正在尝试从不显眼的javascript中绑定ajax事件的处理程序：

var load_remote_form = function(evt) {
    var href = $(this).attr('href'); 
    // load form template
    $.get(href, {}, function(data) {
        $('body').append(data);

        $('form[data-remote]').bind("ajax:beforeSend", function(e) {
            console.log("Caught beforeSend!");
        });
    });
    evt.preventDefault();
};

$(document).ready(function() {
    $('a#signup').click(load_remote_form);   
});

Chrome的开发工具显示事件“ajax:beforeSend”已绑定，但从未处理过（我发送表单时在javascript控制台中没有任何内容，但在rails日志中我看到请求已处理正确，并发送响应）。我可以将其他事件绑定到同一个选择器（form[data-remote]），例如click，并且可以正确处理它们。

通过.live绑定的Ajax事件也不会被处理。但是，如果表单是作为布局的一部分呈现的（即它位于http://localhost:3000/signup/之类的独立页面上），则可以正确处理绑定的“ajax:beforeSend”。

我的控制器（仅用于案例，可能写得不好，但我确信它有效）：

class UsersController < ApplicationController

  layout :layout_for_type

  def new
    @user = User.new
  end

  def create
    @user = User.new(params[:user])
    if @user.save
      session[:user_id] = @user.id
      flash[:notice] = "You have successfully registered."
      redirect_to root_url
    else
      if request.xhr?
        render :action => 'new', :status => :unprocessable_entry, :layout => false
      else
        render :action => 'new'
      end
    end
  end

  def layout_for_type
   request.xhr? ? nil : "application"
  end

end

我做错了什么？可能有更好的方法来实施这种“双重”形式吗？

Answer 1

傻傻的我。我完全忽略了另一个潜在的问题来源。我有

javascript_include_tag :all

在我的应用程序布局中，导致 jquery.js和jquery.min.js包含在我的页面中。事实证明这是造成这种奇怪行为的原因。删除jquery.min.js就可以了。希望有一天对某人有用。

不处理jquery-ujs ajax事件

1 个答案: