如何让我的新注册设计forms为AJAXified？
我想要发生的是，当帐户成功创建时，提交的表单应该消失，并且应该出现一条消息（取决于注册的状态）。
如果成功，他们应该看到一个简单的“谢谢。请检查你的电子邮件。”
如果不是，那么他们应该看到一个合适的消息 – 比如“抱歉，该电子邮件已经被删除”。
这是我的表格：
resource_name, :class => "send-with-ajax", :url => user_registration_path(resource), :validate => true, :html => { :id => 'user_new' }) do |f| %> "your-email@address.com", :input_html => {:autofocus => true}, :validate => true %> "Submit", :value => "Sign Me Up!" %> 这是我的create.js.erb ：
$(document).ready(function() { $('#user_new').submit(function() { $(this).fadeOut(600).hide(); $(this).append('Thank You. You should receive an email shortly.
').fadeIn(1000); }); )}
但这不能正常工作。 例如，当我按下提交并且电子邮件地址已经在数据库中时 – 没有任何反应。
PS我知道如果它是一个’常规’forms，我会在处理这个表格的控制器中做format.js – 并在那里计算出状态代码和消息 – 但是Devise是一个不同的野兽，我不想要当我不舒服时，生成新的控制器并覆盖我不应该的function。
由于Devise在Devise::Registrations控制器上使用respond_with ，您应该能够使用简单的AJAX调用来发送表单并检索响应。 这是我所知道的最简单的forms。
为此，请将此Javascript代码添加到您的注册表单页面：
$("#user_new").submit(function(){ $.ajax({ url: "/users", success: function(){ $(this).fadeOut(600).hide(); $(this).append('Thank You. You should receive an email shortly.
').fadeIn(1000); }, error: function(){ // Put your error code here } }); });
如果要在创建后使用create.js.erb文件，则应执行以下操作：
- 添加
:format => :js和:remote => true到您的form_for -
只有此代码应该在
create.js.erb文件中：$("#user_new").fadeOut(600).hide().append('Thank You. You should receive an email shortly.
').fadeIn(1000);
这样，Devise将在AJAX响应后执行：js文件内容，以防万一。
对我有用的方式是
首先输入:remote => true在注册表单中为:remote => true
那么有2个选项
- 确保控制器所在的表单是repond_to：js和控制器js文件（特别是在我的情况下，它是页面控制器中的主页操作（页面#home））我会在home.js.erb中放入类似的东西
$(function() { return $(".new_user").ajaxError(function(event, jqXHR, ajaxSettings, thrownError) { if (jqXHR.status === 401) { $("#notice").fadeIn(); $("#notice").html(jqXHR.responseText).fadeOut(1000); } }); });
- 第二个选项是使用rails / devise自动使用的js文件，它是需要在/ views / devise / registrations下创建的create.js.erb。 那个文件会是这样的
$("#signUpForm").bind("ajax:success", function(xhr, data, status) { <% if resource.errors.full_messages.count <1 %> $("#noticesignup").html("Confirmation Mail Sent :) "); <% else %> $("#noticesignup").html("<%= escape_javascript ( devise_error_messages!) %>"); <% end %> });
几乎就是这样