Rails AJAX form submission

Question

I want to submit a form via AJAX. When I submit the form, it should send an ajax and fade in to the div with id stepTwo, and fadeout the current div. I am using jQuery 1.8.0, and I have this error in my console when I submit.

 NS_ERROR_FAILURE: Component returned failure code: 0x80004005 (NS_ERROR_FAILURE)      [nsIDOMWindow.getComputedStyle]
[Break On This Error]   

...=[]),o&&(e=" "+e);while(e){k=!1;if(j=B.exec(e))e=e.slice(j[0].length),k=d.push({...

Here's my HTML:

<div id="stepOne">
<%= form_for @program do |f| %>
    <div>
    <label for="exerciseName">Title For Your Program</label>
    <%= f.text_field :title, :name => "exerciseName", :required => "required", :maxlength => "40" %>
    </div>
    <div>
    <label for="exerciseName">Detailed Info For Your Program</label>
    <%= f.text_area :details %>
    </div>

<%= f.submit "Next Step", :class => "exbuttons button-small red rounded3", :id =>"stepOneButton" %>
<% end %>
</div>

And here is my controller

# POST /programs # POST /programs.json def create @program = Program.new(params[:progeram]) @program.user_id = current_user.id

respond_to do |format|
  if @program.save
    if request.xhr?
      render @program
    else
      redirect_to @program
    end
  else
    if request.xhr?
      render @program
    else
      flash[:error] = "Program could not be added"
      redirect_to new
    end
  end
end
end

And this is my Javascript file

function stepOne(){
    $('#new_program').submit(function(event){
        event.preventDefault();
        var f = $(this);
        f.find('input[type="submit"]').attr("disabled", true);
        $.ajax({
            type: f.attr("method"),
            url: f.attr("action"),
            data: f.serialize(),
            complete: function(){
                f.find('input[type="submit"]').attr("disabled", false);
            },

            success : function(data){
                console.log(data);
                $(this).fadeOut();
                $('#stepTwo').delay(400).fadeIn();
            },

            error : function(xhr, status){
                console.log(status);
            }
        });


    });
}

lilwupster · Accepted Answer · 2013-06-12 16:56:20Z

0

the NS_ERROR_FAILURE seems to indicate that the URL is wrong or the rails controller is hitting an error.

Check that the URL the script is calling is actually correct and perhaps run it without ajax to see the error page returned by rails if the url is correct.

You also do not seem to be using the respond_to so probably do not need to include it.

answered Jun 12, 2013 at 16:56

lilwupster

9039 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Rails AJAX form submission

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related