I'm using the Rails form and I'm also using Bootstrap tabs. I have 4 tabs that a user fills out and on the 4th tab is the submission button. I have a number of required: true fields in the form, and when I go to click on the submit button leaving any of these fields blank, the pop-up saying "Please fill out this field" appears.
Question: How can I just have a box appear with ALL the error messages, instead of each individual error message appearing one at a time?
I've read a number of posts, and have tried most suggestions (with exception to ones that include JS, as I'm hoping there is a strong solution not including JS). I put below some code below my submit button that I tried but it doesn't display anything as the individual box error message I think overrides it.
Any help is appreciated.
_Form:
<%= form_for(#property, html: { multipart: true }) do |p| %>
...
<%= p.file_field :picture, :multiple => true, name: "property_attachments[picture][]", size: 2 %>
<%= p.submit "Submit", class: 'btn btn-primary' %>
<% if #property.errors.any? %>
<div id="error_explanation">
<div class="alert alert-danger">
The form contains <%= pluralize(#property.errors.count, "error") %>.
</div>
<ul>
<% #property.errors.full_messages.each do |msg| %>
<li><%= msg %></li>
<% end %>
</ul>
</div>
<% end %>
<% end %>
Figured it out and learning a lot about Rails Forms. I was using required: true for a number of fields and this created individual pop-ups on each error one by one. I removed all of the required: true fields and then added validations in the model (eg. validates: :price, presence: true) and then the error message I used above in my question displayed any missing fields.
Related
As a real beginner in EJS, I have two charts in my html page, so I want to use my partial twice:
<% include partials/spider-chart.ejs %>
But I need to pass some parameters inside the ejs to differentiate between graphs.
What is the best way?
#Naeem Shaikh solution works.
Though include also gives you more intuitive way of including a partial template and also passing context variables to that as found in documention section of ejs.
<ul>
<% users.forEach(function(user){ %>
<%- include('user/show', {user: user}); %>
<% }); %>
</ul>
I think you want to render two different charts using same partial ejs template, just by providing different data(within the main ejs file).
You can just define a variable, which will be assigned to the data, which the first chart will use, than include the chart.ejs file, again change the data, and include the partial ejs file(chart.ejs) again, so now you have two files which can use same variable(data), but can plot different chart based on value assigned to data.
For Example:
<% var data= 'data to be used by first chart(parameter)'; %>
<% include partials/spider-chart.ejs %>
// re-initializing data for second chart
<% data= 'data to be used by second chart(parameter)'; %>
<% include partials/spider-chart.ejs %>
where your spider-chart.ejs file could be something which will use data
spider-chart.ejs
<li>
<%= data %> // just an example
</li>
here, as you use data, the data variable accessed by both charts will be different because you are reassigning values for data before every chart.
You can pass single as well as multiple data here is how to do it
In render funtions
We can pass multiple data as an object like this
app.get("/account", function(req, res) {
res.render("account", {
name: 'Jon Snow',
age: 35
});
});
And then can access the data inside account using ejs simple template tags like this
<h2> hello <%= name %> </h2>
<p> your age is <%= age %> </p>
In Partial views
Pass the data like this
<%- include('partials/logout', {name='triyon'}) %>
And access it like we did above
<h2> logged out <%= name %> </h2>
This is the best workaround by just passing the view file name as a context while rendering the base ejs file.
/base.ejs:
<html>
<%- include(content) %>
</html>
/extra.ejs:
<div> some content which is to be added in base ejs file </div>
/controller.js:
res.render('base', { content: 'extra' })
I keep getting this error
undefined method`content'for"Post::ActiveRecord_Associations_CollectionProxy:0x00000104e87060"
When I do <%= #user.posts.content %>
but when I do <%= #user.posts.count %> everything shows up normal and it works... I don't understand why I can call count and it show's the number of posts in the users show.html.erb page but when I try and show the content it throws and error.
Any ideas?
Instead of <%= #user.posts.content %>
Use this
<% #user.posts.each do |post| %>
<%= post.content %>
<% end %>
#user.posts return a collection of posts. So, when you call count you get the count of all records returned by #user.posts. BUT in order to access content attribute of each post, you will need to iterate over the collection and display the relevant data.
Getting through Michael Hartl's tutorial great; I've encountered a few snags along the way but nonetheless, it's working out better than I expected.
My question, is regarding the partial file. In the tutorial if I have read correctly, chapter 5- it advises to edit the 'application.html.erb' file with...
'<!DOCTYPE html>
<html>
<head>
<title><%= full_title(yield(:title)) %></title>
<%= stylesheet_link_tag "application", media: "all",
"data-turbolinks-track" => true %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>
<%= csrf_meta_tags %>
<%= render 'layouts/shim' %>
</head>
<body>
<%= render 'layouts/header' %>
<div class="container">
<%= yield %>
</div>
</body>
</html>'
The tutorial then says if this line worked I should find a file called 'app/views/layouts/_shim.html.erb' and I cannot find it, thus, it was not automatically created, further not allowing me to pull up the referring static page in my browser (which may or may not be related).
Thanks in advance.
Of course, to get the partial to work, we have to fill it with some content; in the case of the shim partial, this is just the three lines of shim code from Listing 5.1; the result appears in Listing 5.10.
So yes. You have to create partial file by yourself and fill it with proper content. In case you code editor doesn't support partial extraction.
For example:
Using rails.vim plugin for VIM there is the possibility to extract selected lines into partial by using Rextract <partial_name> command. Which creates new file, moves selected lines into it and replace selected lines from source file with <%= render :partial => '<partial_name>' %>
I browsed all SO questions and answers about this topic but I'm still unable to make my scenario work.
I want to trigger a click button action when a dropdown menu option is selected ; seems simple and should be very common with AJAX.
Here are the relevant excerpts of my code:
<%= form_for(#test, :html => {:id => "form_id", :name => "MyForm", :remote => "true"}) do |form| %>
<%= form.label "Menu1" %>
<%= form.select (:Menu1, [["Option1","value1"],["Option2","value2"]], :html_options=>{:onChange=>"javascript: this.form.apply_button_name.click();"}) %>
<!-- more select menus and text fields here -->
<div class="actions">
<%= form.submit "Apply", :name => "apply_button_name", :remote => "true" %>
</div>
<% end %>
I used ":remote => "true" both for the form and the button because that's the only way to get AJAX working. I also tried with and without explicit "html_options" and "javascript:", after I browsed some SO answers that suggested that but that did not help. I also tried onSelect, and onClick instead of onChange, but still no luck.
The generated HTML is the following:
Menu1
<select id="test_Menu1" name="test[Menu1]"><option value="value1">Option1</option>
<option value="value2" selected="selected">Option2</option></select>
As you can see, there's no onChange event handler in the HTML code ; WHY? Anyone is seeing what am I doing wrong?
Thanks for any help.
Modify your call to form.select, like this:
<%= form.select :Menu1, [["Option1","value1"],["Option2","value2"]], {},
:onChange=>"javascript: this.form.apply_button_name.click();" %>
If you examine the documentation for:
API Dock Ruby on Rails select
You will see that the select form helper takes the form:
select(object, method, choices, options = {}, html_options = {})
If you don't pass anything for the option hash (in your case this will be an empty hash), the form thinks that your html_options hash are your options hash, and gets confused.
A way to check this is to add something like {:onchange=> "alert('Hello');"} and either see if the event successfully triggers, or alternatively, in your actual web page, right click on the select element and inspect it. If no onchange option is present in the html, that means that your rails form helper is indeed confusing the html_options with the other options. So, what you should have:
<%= form.select (:Menu1, [["Option1","value1"],["Option2","value2"]], {}, {:onChange=>"handler();"} %>
MAKE SURE TO INCLUDE THE EMPTY HASH FOR THE OPTIONS BEFORE THE HTML OPTIONS AND YOU SHOULD BE FINE. I don't think you even need to have the html_options and javascript stuff you have.
Lastly, if onChange doesn't work, try to use onchange with no capital C.
I'm going through Agile Web Development with Rails and I'm having some trouble with the form helper text_area. Specifically, I want to make the text area smaller (the form submits correctly and everything goes into the database correctly). According to the book this code should work:
<%= form_for(#request) do |f| %>
<div class="actions">
...
<div class="field">
<%= f.label :quote_details, "*Items required:" %>
<%= f.text_area :quote_details, :rows=>5, :cols=>40 %>
</div>
It seems that no matter what numbers I put for :rows or :cols, the box stays the same default size. Instead of :rows and :cols, I used :size=>"3x40" and size=>"5x8" etc.. but the box still always stays the same size.
As an experiment I tried
<%= f.text_field :quote_details, :size=>"300*39" %>
That changed the number of columns, but removing the :size and putting :rows or :cols has no effect (it goes back to a default size for a text_field).
I did see this:
Change default Rails text_area helper rows/cols
I tried answer 1, but the answer given didn't work for me. I don't really understand what the second and third answers mean. I might be doing something else wrong or maybe it's a different problem.
I'm just stumped. Any help or ideas on what's going on would be greatly appreciated. Thanks for any responses.
Oh, I'm using rails version 3.0.0 and ruby 1.9.2p0 on vista.
your first code segment has :cols => 40% instead of 40?
I would also consider using CSS to do it, as that can make changing the look of the webpage isolated to the CSS presentation layer.
try do it with form_with. For me it works.
<%=form_with, local: true do |form| %>
<%= form.label :comment %>
<%= form.text_area :body, :rows=>10, :cols=>60 %>
<% end %>