CODEWITHSUNDEEP
javascriptjqueryhtmlruby-on-railsruby
Baodoan
Baodoan

Reputation: 63

Ruby/JS how to reload page after submit button?

I'm writing an web app using ruby on rails. In the controller:

  def create
@category = Category.new(category_params)

respond_to do |format|
  if @category.save
    format.html { redirect_to @category, notice: 'Category was successfully created.' }
    format.json { render :show, status: :created, location: @category }
    format.js { render js: 'window.top.location.href = "/categories";' }
  else
    format.html { render :new }
    format.json { render json: @category.errors, status: :unprocessable_entity }
  end

end

In the new.html.erb:

<h1>New category</h1>
<%= render 'form' %>
<%= link_to 'Back', categories_path %>

In _form.html.erb:

<%= form_for(@category) do |f| %>
<% if @category.errors.any? %>
<div id="error_explanation">
  <h2><%= pluralize(@category.errors.count, "error") %> prohibited this category from being saved:</h2>
  <ul>
  <% @category.errors.full_messages.each do |message| %>
    <li><%= message %></li>
  <% end %>
  </ul>
</div>
<% end %>
<div class="field">
<%= f.label :content %><br>
<%= f.text_field :content, placeholder: "content" %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_area :description, placeholder: "description" %>
</div>
<div class="actions">
<a href="#" onclick="window.top.location.reload(true)"><%= f.submit  %>
</a>
</div>
<% end %>

I want the submit button to function and the newly created category is saved before the page is refreshed. In the code, the page is refreshed before saving. Please help. thanks

Upvotes: 5

Views: 4408

Answers (2)

Jay-Ar Polidario
Jay-Ar Polidario

Reputation: 6603

I prefer using unobtrusive javascript. As such, my answer as follows:

_form.html.erb

<%= form_for(@category, remote: true) do |f| %>
  ...
  <div class="actions">
    <%= f.submit %>
  </a>
</div>
<% end %>

categories_controller.rb

def create
  @category = Category.new(category_params)

  respond_to do |format|
    if @category.save
      format.html { redirect_to @category, notice: 'Category was successfully created.' }
      format.json { render :show, status: :created, location: @category }
      format.js { render js: 'window.top.location.reload(true);' }
    else
      format.html { render :new }
      format.json { render json: @category.errors, status: :unprocessable_entity }
    end
  end
end

Note that I updated format.js to render a JS script that will reload the page, as you wanted. You should know however that this script will work on ANY page wherever a JS POST request to /categories is called.

Upvotes: 4

Rahul
Rahul

Reputation: 229

Hello there In this case you should submit the form through js i.e.

<%= form_for(@category, remote: true) do |f| %>
<%= end%>

Please let me know if is there any issue.

Upvotes: 3

Related Questions