Submit button does not work unless I refresh the page form_for Rails

Question

I have an app that has a problem model and when I go to create a record the submit button does nothing. No errors given it just simply doesnt execute, unless I refresh the page and attempt add it again. The same happens when I go to update a record.

Here is my controller

class ProblemsController < ApplicationController
 include Concerns::Votes
def index
 @problems = Problem.all
end

def show
 @problem = find_problem
end

def new
 @problem = Problem.new
end

def edit
 @problem = find_problem
end

def create
 @problem = current_user.problems.new(problem_params)
 @problem.save
 redirect_to @problem
end

def update
 @problem = find_problem
  if @problem.update_attributes(problem_params)
    redirect_to @problem
  else
    redirect_to @problem
  end
end

private

def find_problem
 @problem = Problem.find(params[:id])
end

def problem_params
params.require(:problem).permit(:name, :description, :url)
end 
end

Here is my _form.html.erb partial that I am rendering on new.html

<div class="row">
<div class="large-12 columns">
<%= form_for @problem do |f| %>
<label>Name</label>
<%= f.text_field :name, placeholder: "Name your problem!" %>
</div>
 <div class="large-8 columns">
<%= f.text_field :url, placeholder: "Link to any supporting material" %>
 </div>
 <div class="large-12 columns">
 <%= f.text_area :description %>
 </div>
 <div class="large-12 columns">
 <%= f.submit "Create" %>
 </div>
 </div>
 <% end %>

I have resources :problems in my routes.

Here for good measure is my show.html.erb as well.

<%= div_for @problem do %>
<%= link_to 'Edit', edit_problem_path(@problem) %>
<h2><%= @problem.name %> (<%= @problem.cached_votes_score %>)</h2>
<a =href"<%= @problem.url %>"><%= @problem.url %></a>
<p><%= @problem.description %><p>
By <%= @problem.user.name %></br>
<a class="button"<%= link_to 'Up', {:controller => 'problems', :action => 'up_vote'}, {:method => :post } %></a>
<a class="button"<%= link_to 'Down', {:controller => 'problems', :action => 'down_vote'}, {:method => :post } %></a>
<%= link_to 'Edit', edit_problem_path(@problem) %> |
<%= link_to 'Back', problem_path %>
<% end %>

Here is my index.html.erb

<div class="row">
<div class="large-12 columns">
  <% @problems.each do |problem| %>
    <h1><small><%= problem.cached_votes_score %></small> <%= link_to problem.name, problem %></h1>
 <% end %>
 </div>
 <%= link_to 'New Problem', new_problem_path %>
</div>

I really cant understand why it works if i refresh the page but otherwise it doesnt work at all.

Instead of <%= f.submit "create" %> do <%= f.submit :submit %> try this .. — sp1rs, Apr 28 '14 at 11:18
You may need to change the place you put form_for and end tag. Just because it's not placed right, so it need us to refresh the page before handling function! — Travis Le, Dec 24 '18 at 10:04

score 29 · Accepted Answer · answered Apr 28 '14 at 11:34

29

Your HTML is invalid, the submit button is actually not nested under the form tag. Try changing your view code to this:

<div class="row">
  <div class="large-12 columns">
    <%= form_for @problem do |f| %>
      <label>Name</label>
      <%= f.text_field :name, placeholder: "Name your problem!" %>
      <div class="large-8 columns">
        <%= f.text_field :url, placeholder: "Link to any supporting material" %>
      </div>
      <div class="large-12 columns">
        <%= f.text_area :description %>
      </div>
      <div class="large-12 columns">
        <%= f.submit "Create" %>
      </div>
    <% end %>
  </div>
</div>

answered Apr 28 '14 at 11:34

fivedigit

18,464
6
54
58

It is under `form_tag` – Rajdeep Singh Apr 28 '14 at 11:41
Check the source of the rendered HTML page. The tag is not under the
tag there.
– fivedigit Apr 28 '14 at 11:42
1

Much appreciated both of you. Bit of a dim moment here for me. – DMH Apr 28 '14 at 12:23
3

Thanks for this answer - I was banging my head against the wall over this forever, when I realized the issue was missing the closing carat of a div tag (` – Todd Aug 13 '15 at 14:24
1

Same, I had an extra `` and had no idea that this would cause my button to render outside my form – MCB May 27 '16 at 22:11
Had the same problem, also found extra ``. – bmalets Mar 18 '20 at 23:46
Same here, an extra ``. I wish I had an editor that showed these better. But hard trying to see div and Rails logic `do` and `end` mixed together. Mainly posted to say still a problem and a fix another year later and with Rails 6. – Greg Jul 04 '21 at 00:05

score 6 · Answer 2 · answered Aug 30 '15 at 12:51

I had same issue

Before

<%= simple_form_for(:schedule_list, url: schedulelists_create_with_block_path, :html => { novalidate: false}) do |f| %> 
<div class="row">
  <div class="col-md-12">
    <%= f.button :submit, class: 'pull-right' %>
    <%end%>
  </div>
</div>

After

<%= simple_form_for(:schedule_list, url: schedulelists_create_with_block_path, :html => { novalidate: false}) do |f| %> 
    <div class="row">
      <div class="col-md-12">
        <%= f.button :submit, class: 'pull-right' %>
      </div>
    </div>
<%end%>

should be `f.submit 'button-text', class: 'pull-right'` – bmalets Mar 18 '20 at 23:41 — bmalets, Mar 18 '20 at 23:41

Submit button does not work unless I refresh the page form_for Rails

2 Answers2

Linked