AJAX form submitting in HTML rails 4 - ruby-on-rails

I've looked through several of these kind of questions but none of them work for me.
Weirdly enough the same strategy to a different form works perfectly.
I have model validations in place but when I submit an empty form I get an error of missing template of ceeate where format is HTML.
I guess the purpose of each file is self-explanatory.
My ContactsController.rb:
class ContactsController < ApplicationController
respond_to :html, :js
def new
#contact = Contact.new
end
def create
#contact = Contact.new(params[:contact])
#contact.request = request
end
end
new.js.ebr:
$("#main-block").html("<%= escape_javascript(render 'contact_form') %>")
_contact_form.html.erb:
<div align="center">
<h3>Sazinieties ar mums</h3>
<ul class="errors"></ul>
<%= form_for #contact, :html => {:class => 'form-horizontal' } do |f| %>
<div class="control-group">
<%= f.label :name, class: "control-label" %>
<div class="controls">
<%= f.text_field :name %>
</div>
</div>
<div class="control-group"><div class="field">
<%= f.label :e_mail, class: "control-label" %>
<div class="controls">
<%= f.email_field :e_mail %>
</div>
</div>
<div class="control-group"><div class="field">
<%= f.label :message, class: "control-label" %>
<div class="controls">
<%= f.text_area :message %>
</div>
</div>
<div>
</br>
<%= f.submit('Sūtīt', remote: true, class: "btn btn-primary") %>
</div>
<% end %>
</div>
create.js. erb:
<%= render 'save' %>
_save.js.erb:
$("ul.errors").html("")
<% if #contact.errors.any? %>
<% #contact.errors.full_messages.each do |message| %>
$("ul.errors").append($("<li />").html("<%= message.html_safe %>"))
<% end %>
<% else %>
$("#main-block").empty()
$("#main-block").html("Ziņa ir nosūtīta. Tuvākajā laikā sniegsim atbildi!")
<% end %>

You need to add this to your form:
<%= form_for #contact, :remote => true, :html => {:class => 'form-horizontal' } do |f| %>
And remove remote: true from your submit button.

Related

No route matches [POST] "/contacts/new" Ruby on Rails

I'm building an interactive website through Cloud9 using a tutorial online. We are using bootstrap, JavaScript, ruby on rails, html, and scss. However, I am currently stuck. Whenever I click 'submit'...I get a Routing Error page. None of the information is stored in my db.
routes.rb
Rails.application.routes.draw do
root to: 'pages#home'
get 'about', to: 'pages#about'
resources :contacts
end
contacts_controller.rb
class ContactsController < ApplicationController
def new
#contact = Contact.new
end
def create
#contact = Contact.new(contact_params)
if #contact.save
redirect_to new_contact_path, notice: "Message sent."
else
redirect_to new_contact_path, notice: "Error occured."
end
end
private
def contact_params
params.require(:contact).permit(:name, :email, :comments)
end
end
contacts/new.html.erb
<div class="container">
<div class="row">
<h3 class="text-center">Contact Us</h3>
<div class="col-md-4 col-md-offset-4">
<%= flash[:notice] %>
<div class="well">
<%= form_for "contact" do |f| %>
<div class="form-group">
<%= f.label :name %>
<%= f.text_field :name, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :email %>
<%= f.text_field :email, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :comments %>
<%= f.text_area :comments, class: 'form-control' %>
</div>
<%= f.submit 'Submit', class: 'btn btn-default' %>
<% end %>
</div>
</div>
</div>
</div>
I followed the instructions exactly, and I have no idea what is wrong or what to change. Can someone help before I rip my hair out?
You need to change
<%= form_for "contact" do |f| %>
to
<%= form_for #contact do |f| %>
Full code
<div class="container">
<div class="row">
<h3 class="text-center">Contact Us</h3>
<div class="col-md-4 col-md-offset-4">
<%= flash[:notice] %>
<div class="well">
<%= form_for #contact do |f| %>
<div class="form-group">
<%= f.label :name %>
<%= f.text_field :name, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :email %>
<%= f.text_field :email, class: 'form-control' %>
</div>
<div class="form-group">
<%= f.label :comments %>
<%= f.text_area :comments, class: 'form-control' %>
</div>
<%= f.submit 'Submit', class: 'btn btn-default' %>
<% end %>
</div>
</div>
</div>
</div>

No route matches [POST] "/links/new"

I have a model called 'links.' In routes.rb I have defined it with:
resources :links
I have a form in /links/new it looks like this:
<%= form_for :links do |f| %>
<div class="form-group">
<%= f.label :title %>
<%= f.text_field :title, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :url %>
<%= f.url_field :url, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :description %>
<%= f.text_area :description, class: "form-control" %>
</div>
<div class="form-group">
<%= f.submit :"Create Link", class: "btn btn-primary" %>
</div>
<% end %>
When I submit it, I get the error No route matches [POST] "/links/new"
even though this is in the list of routes:
new_link_path GET /links/new(.:format) links#new
What is the problem?
Try this:
<%= form_for(Link.new) do |f| %>
<div class="form-group">
<%= f.label :title %>
<%= f.text_field :title, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :url %>
<%= f.url_field :url, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :description %>
<%= f.text_area :description, class: "form-control" %>
</div>
<div class="form-group">
<%= f.submit "Create Link", class: "btn btn-primary" %>
</div>
<% end %>
add NEW route method in controller Controller
def new
#link = Link.new
end
When you will visit to links/new then new route method will call and render links/new template. so add below code in tamplete
<% form_for(:link, #link, :url => {:action => 'create'}) do |f| %>
<div class="form-group">
<%= f.label :title %>
<%= f.text_field :title, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :url %>
<%= f.url_field :url, class: "form-control" %>
</div>
<div class="form-group">
<%= f.label :description %>
<%= f.text_area :description, class: "form-control" %>
</div>
<div class="form-group">
<%= f.submit "Create Link", class: "btn btn-primary" %>
</div>
<% end %>
and handle create request in create action of link controller
def create
#link = Link.new params[:link]
if #link.save
redirect_to :action => 'show', :id => #link.id
else
render :action => 'new'
end
end
dont forget to allow params for link in controller.
this is a proper way to create a new record in ror

My submit button won't work in rails and I'm not sure why

I'm creating a simple form in rails and the submit button doesn't work. I think I'm missing something obvious here but the html seems to be fine (I'm far froma front end expert). Any advice or pointers?
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2>Apply</h2>
<hr class="star-primary">
</div>
</div>
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="row control-group">
<% if #user.errors.any? %>
<div id="error_explanation">
<div class="alert alert-error">
The form contains <%= pluralize(#user.errors.count, "error") %>.
</div>
<ul>
<% #user.errors.full_messages.each do |msg| %>
<li>* <%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="col-xs-12 floating-label-form-group controls">
<%= form_for #user, url: users_path(#user), :html => {:method => :post} do |f| %>
<%= f.label :name %>
<%= f.text_field :name, class: "form-control", placeholder: 'Name' %>
<%= f.label :email%>
<%= f.text_field :email, class: "form-control", placeholder: "Email" %>
<%= f.label :address%>
<%= f.text_field :address, class: "form-control", placeholder: "Address" %>
<%= f.label :phone %>
<%= f.text_field :phone, class: "form-control", placeholder: "Phone Number" %>
<%= f.submit "Apply"%>
<%end%>
</div>
</div>
</div>
</div>
</div>
Also, when the submit button fails, nothing happens. No error messages, no console errors. Nothing.
Take method out from the html hash?
form_for #user, url: users_path(#user), :method => :post do |f|
Try this:
<%= form_for #user, :url => {:controller => "your-controller-name", :action => "your-action-name"} do |f| %>
Can you try this one:
<%= form_for #user, url: {action: "create"} do |f| %>
...
...
<%= f.submit "Apply" %>
<% end %>
But I strongly suggest you to use simple_form gem.

Display images from DB in a form_for RoR

I'm trying to create an update form that would modify ( add or remove ) images related to a product. Each product has many images , each image belongs to a product.
When a user wants to modify a product , the idea is that all the images related to the product displayed and the user decides whether to add more or remove them. My problem is I do not know how to make the images appear. I can only make it show the link.
edit.html.erb
<%- model_class = Product -%>
<div class="page-header">
<h1><%=t '.title', :default => [:'helpers.titles.edit', 'Edit %{model}'], :model => model_class.model_name.human.titleize %></h1>
</div>
<%= render :partial => 'form' %>
_form.html.erb
<%= form_for #product, :html => { :class => "form-horizontal product" } do |f| %>
<% if #product.errors.any? %>
<div id="error_expl" class="panel panel-danger">
<div class="panel-heading">
<h3 class="panel-title"><%= pluralize(#product.errors.count, "error") %> prohibited this product from being saved:</h3>
</div>
<div class="panel-body">
<ul>
<% #product.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
</div>
<% end %>
<div class="control-group">
<%= f.label :name, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :name, :class => 'form-control' %>
</div>
<%= error_span(#product[:name]) %>
</div>
<div class="control-group">
<%= f.label :price, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :price, :class => 'form-control' %>
</div>
<%= error_span(#product[:price]) %>
</div>
<div class="control-group">
<%= f.label :stock, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :stock, :class => 'form-control' %>
</div>
<%= error_span(#product[:stock]) %>
</div>
<div class="control-group">
<%= f.label :tipo, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :tipo, :class => 'form-control' %>
</div>
<%= error_span(#product[:tipo]) %>
</div>
<p> <hr> </p>
<%= f.fields_for :images do |builder| %>
<%= render 'image_fields', f: builder %>
<% end %>
<%= link_to_add_fields "Add Question", f, :images %>
<p> <hr> </p>
<%= f.submit nil, :class => 'btn btn-primary' %>
<%= link_to t('.cancel', :default => t("helpers.links.cancel")),
products_path, :class => 'btn btn-default' %>
<% end %>
_image_fields.html.erb
<fieldset>
<%= f.label :link, "Imagen" %><br />
<div class="col-xs-6 col-md-3">
<a href="#" class="thumbnail">
<img src="<%= Here I want to introduce the link %>" alt="...">
</a>
</div>
<%= f.check_box :_destroy %>
<%= f.label :_destroy, "Remove Imagen" %>
</fieldset>
products_controller.rb
class ProductsController < ApplicationController
before_action :set_product, only: [:show, :edit, :update, :destroy]
before_action :build_image, only: [:edit]
private
# Use callbacks to share common setup or constraints between actions.
def set_product
#product = Product.find(params[:id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def product_params
params.require(:product).permit(:name, :price, :stock, :tipo, images_attributes: [ :link ])
end
def build_image
#images = #product.images.build
end
end

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

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.
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>
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%>

Resources