4

In my Jquery bind method , 'ajax:success', 'ajax:error' or 'ajax:complete' callbacks are not being excuted. The form is being submitted through Ajax and the data is inserted to the database successfully but those callbacks function are not being invoked at all (its simply supposed to show alert pop up inside those callbacks.) I am using Jquery 1.6,Rails 3.1 Here is my code.Thank you in advance.

Form

<%= form_for(resource,:as=>resource_name,:url => registration_path(resource_name), :html => {:id => "sign_up_user"},:remote => true,:format => :json) do |f| %>
 <%= devise_error_messages! %>
 <%= f.label :Username %>
 <%= f.text_field :username %></p>
 <%= f.label :email %>
 <%= f.text_field :email %>
 <%= f.label :password %>
 <%= f.password_field :password %>
 <%= f.label :password_confirmation %>
 <%= f.password_field :password_confirmation %>
 <%= f.submit "Sign up" ,:id=>"sign-up" %>
<% end %>

Ajax bind

$('#sign_up_user').bind('ajax:success', function( data, status, xhr) {
  alert("success");
});

Controller

class RegistrationsController < Devise::RegistrationsController

  def create
    build_resource

    if resource.save
      if resource.active_for_authentication?
        set_flash_message :notice, :signed_up if is_navigational_format?
        sign_up(resource_name, resource)
        return render :json => {:success => true}
      else
       set_flash_message :notice, :"signed_up_but_#{resource.inactive_message}" if is_navigational_format?
       expire_session_data_after_sign_in!
       return render :json => {:success => true}
      end
    else
      clean_up_passwords resource
      return render :json => {:success => false}
    end
  end

# Signs in a user on sign up. You can overwrite this method in your own RegistrationsController
  def sign_up(resource_name, resource)
    sign_in(resource_name, resource)
  end

end

Log

Started POST "/users" for 127.0.0.1 at 2013-08-13 22:12:51 -0500
Processing by Devise::RegistrationsController#create as JS
Parameters: {"utf8"=>"✓",  "authenticity_token"=>"mrcZMq5WT1QPNpGDGsVFWIPx+WqfI0PZmHfGqs7jnrM=", "user"=> {"username"=>"ksks", "email"=>"jsjs@t.comq", "password"=>"[FILTERED]", "password_confirmation"=>"[FILTERED]", "address"=>"", "business"=>"0"}, "commit"=>"Sign up"}

(0.2ms)  SELECT 1 FROM "users" WHERE LOWER("users"."email") = LOWER('jsjs@t.comq')  LIMIT 1
SQL (2.6ms)  INSERT INTO "users" ("address", "business", "business_name",  "business_type", "city", "created_at", "current_sign_in_at", "current_sign_in_ip", "email", "encrypted_password", "last_sign_in_at", "last_sign_in_ip", "phone", "remember_created_at", "remember_token", "reset_password_token", "sign_in_count", "state", "updated_at",  "username", "zipcode") VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)  [["address", nil], ["business", false], ["business_name", nil], ["business_type", nil], ["city", nil], ["created_at", Wed, 14 Aug 2013 03:12:52 UTC +00:00], ["current_sign_in_at", nil], ["current_sign_in_ip", nil], ["email", "jsjs@t.comq"], ["encrypted_password", "$2a$10$uynKQ8s3sjBe5W3LfqFxSO9Z2jg9FB.m8LbVOiiBNqDtT9qF1j7Sy"], ["last_sign_in_at", nil], ["last_sign_in_ip", nil], ["phone", nil], ["remember_created_at", nil], ["remember_token", nil], ["reset_password_token", nil], ["sign_in_count", 0], ["state", nil], ["updated_at",  Wed, 14 Aug 2013 03:12:52 UTC +00:00], ["username", "ksks"], ["zipcode", nil]]
  (0.4ms)  UPDATE "users" SET "last_sign_in_at" = '2013-08-14 03:12:52.570849', "current_sign_in_at" = '2013-08-14 03:12:52.570849', "last_sign_in_ip" = '127.0.0.1', "current_sign_in_ip" = '127.0.0.1', "sign_in_count" = 1, "updated_at" = '2013-08-14 03:12:52.572092' WHERE "users"."id" = 35
Pierre
  • 1,252
  • 1
  • 14
  • 24
katie
  • 2,921
  • 8
  • 34
  • 51
  • have you verified that the ID you're applying the callback to is the ID you're using on the form? Are you loading the JS onto the page you're expecting these callbacks to get hit on? – sevenseacat Aug 15 '13 at 02:39
  • Yes , it is the same id, but i am not loading the js in the view yet. – katie Aug 15 '13 at 02:44
  • how is the callback supposed to be called if its not loaded? – sevenseacat Aug 15 '13 at 02:51
  • Is it required? Because i don't need to render anything the view in my case, i just need to know if it is successful or not. – katie Aug 15 '13 at 02:57
  • In terms of placement within the view, is the bind JS at the very end? Either way, is it wrapped within a `$(document).ready`? Could it be that potentially, the JS is executed before the form has had time to render? – Adrian CB Aug 15 '13 at 03:57
  • @Adrian I am not rendering anything in the view, Unless if i didn't get your question? – katie Aug 15 '13 at 04:26
  • yes, you actually need to include the JS in your page for it to be executable. – sevenseacat Aug 15 '13 at 06:30
  • @Katie - you are. :) You're rendering at the very least, the form. In what view did you place that JS? – Adrian CB Aug 15 '13 at 12:25

1 Answers1

4

In Jquery, Ajax Event has two types. One is local event, another is global event.

Local Event, It will be defined with ajax request:

$.ajax('YOUR PATH', {success: function(){ alert(!) }});

Global Event, It should be binded with document element:

$(document).bind('ajaxSuccess', function() {
    alert('!');
});

see fiddle and jquery api

Bigxiang
  • 6,252
  • 3
  • 22
  • 20
  • In Rails, you can bind to the form ajax callbacks. http://stackoverflow.com/questions/15395105/trying-to-figure-out-ruby-on-rails-remote-true-callbacks – mindriot Dec 07 '15 at 03:57