I have a form
<%= form_for #user, url: contact_path do |form| %>
<%= form.select(:email, User.all.map(&:email), {}, { class: 'my-form' }) %>
<% end %>
which works well but has placeholder "Undefined" in start position.
I tried to get rid of that with
<%= form.select(:email, User.all.map(&:email), {placeholder: "Select email"}, { class: 'my-form' }) %>
or
<%= form.select(:email, User.all.map(&:email), {prompt: "Select email"}, { class: 'my-form' }) %>
but still same. Any ideas?
<%= form.select :email, options_for_select(User.all.map(&:email)), include_blank: "whatever your prompt says" , class: 'my-form' %>
Experienced same issues today and this is what I did for one of our projects recently.
<%= f.select :category, options_for_select(Category.all.collect { |c| [c.name, c.id] }), { include_blank: 'Select category' }, { class: 'custom-select' } %>
Try changing the values according to your values.
This is how you add class and placeholder in a form.select element in Rails.
Related
Here is code sample:
<%= form_for #article, html: { class: "form-horizontal" } do |f| %>
<div class="form-group">
<%= f.label :keywords, class: 'col-md-1 control-label' %>
<div class="col-md-3">
<%= f.select :keywords, ['test_1', 'test_2', 'test_3', 'test_4', 'test_5'], {}, { :multiple => true, :size => 10, :class => 'form-control' } %>
</div>
</div>
<% end %>
When I set multiple to 'false' it works just fine, but if I set it to true (for multiple select), it just doesn't pass any data. If I have verification it gives me an "keyword is empty" error and if I remove validation - it is just empty. Any ideas?
<%= f.select :keywords, options_for_select([['test_1','test_1'], ['test_2','test_2'], ['test_3','test_3'], ['test_4','test_4'], ['test_5','test_5']]), {}, { :multiple => true, :size => 10, :class => 'form-control' } %>
<%= f.select :id, lists.collect{ |p| [p.name, p.id] } << "add product", { prompt: t("select product") }, { :class => "selectpicker" } %>
The problem is that "add product" is being added on the last index but I want it on the second index.
You can use insert and pass the index you want to insert the data in:
Tweaking a bit the code:
<%= f.select :id, lists.map { |p| [p.name, p.id] }.insert(1, 'add product'), { prompt: t('select product') }, { class: 'selectpicker' } %>
i have a select tag which i am generating by looping the records and creating options manually. Here is the code:
<%= f.select (:book_id_eq_any) do %>
<%= content_tag(:option, "Choose your option", value: "", disabled: '', selected: '') %>
<% #books.each do |book| %>
<%= content_tag(:option, book.book_title, value: book.id) %>
<% end %>
<% end %>
When i add {multiple: true}, it does not work. Can anyone give me hint about it. Thanks
Just use the built-in select form helper:
<%= f.collection_select :book_id_eq_any, #books, :id, :book_title, { include_blank: "Choose your option" }, { multiple: true } %>
Does anyone know how to add a class to a ruby on rails simple form, and how to add a class to an individual component so that I can style them later in CSS. Thank you
Straight from the simpleform docs:
It is also possible to pass any html attribute straight to the input, by using the :input_html option, for instance:
<%= simple_form_for #user do |f| %>
<%= f.input :username, input_html: { class: 'special' } %>
<%= f.input :password, input_html: { maxlength: 20 } %>
<%= f.input :remember_me, input_html: { value: '1' } %>
<%= f.button :submit %>
<% end %>
If you want to pass the same options to all inputs in the form (for example, a default class), you can use the :defaults option in simple_form_for. Specific options in input call will overwrite the defaults:
<%= simple_form_for #user, defaults: { input_html: { class: 'default_class' } } do |f| %>
<%= f.input :username, input_html: { class: 'special' } %>
<%= f.input :password, input_html: { maxlength: 20 } %>
<%= f.input :remember_me, input_html: { value: '1' } %>
<%= f.button :submit %>
<% end %>
Just adding a point to #bmac151's answer above.
For styling or dynamic scripting (e.g. javascript) purposes, you can also provide an ID to distinguish the elements from other elements of the same class by providing the id option, like so:
<%= simple_form_for #user, html: { id: 'simple-form' } do |f| %>
<%= f.input :username, input_html: { class: 'special', id: 'username' } %>
<%= f.input :password, input_html: { maxlength: 20, id: 'password' } %>
<%= f.input :remember_me, input_html: { value: '1', id: 'remember_me' } %>
<%= f.button :submit, id: 'submit-button' %>
<% end %>
This will give you unique IDs for all of the elements in the form, as well as the form itself.
From CSS, you can refer to these for styling, like this:
#simple-form {
font-size: 125%;
}
#submit-button {
text-transform: uppercase;
}
From Javascript, you can refer to elements by their element ID, as well. With this, you can apply dynamic behaviors to individual elements, rather than whole classes at a time. Here's a Javascript example:
var submit_button = document.getElementById("submit-button");
submit_button.addEventListener("click", function () {
alert('Yeeehaaah!');
submit_button.submit();
});
For fine-grained control, you'll want to use the id attribute rather than the class attribute; however, for theme-like control of elements, the class attribute is more useful.
<%= f.button :submit, "Sign in", class: "submit-button" %>
Want to show different job categories for my jobs board , using the simple form gem I have added the following to my jobs form.
_form.html.erb
<%= simple_form_for(#job, html: { class: 'form-horizontal' }) do |f| %>
<%= f.collection_select :category_id, Category.all, :id, :name, {prompt: "Choose a category" }, input_html: { class: "dropdown-toggle" } %>
<%= f.input :title, label: "Job Title", input_html: { class: "form-control" } %>
<%= f.input :description, label: "Job Description", input_html: { class: "form-control" } %>
<%= f.input :company, label: "Your Company", input_html: {class: "form-control" } %>
<%= f.input :url, label: "Link to Job", input_html: { class: "form-control" } %>
<br/>
<div class="form-group">
<%= f.submit class: "btn btn-primary" %>
</div>
<% end %>
but when i go to jobs.new.html it generates the following error
NameError in Jobs#new
Showing /Users/neilpatel/Desktop/Rails/jobs_board/app/views/jobs/_form.html.erb where line #3 raised:
uninitialized constant ActionView::CompiledTemplates::Category
<%= simple_form_for(#job, html: { class: 'form-horizontal' }) do |f| %>
**<%= f.collection_select :category_id, Category.all, :id, :name, {prompt: "Choose a category" }, input_html: { class: "dropdown-toggle" } %>** -<error
<%= f.input :title, label: "Job Title", input_html: { class: "form-control" } %>
Error specifies you don't have Category Model in your application. That's why rails considering Category as constant and throwing this error uninitialized constant. Try add Category Model in you app/models directory.
<%= f.collection_select :category_id, Category.all, :id, :name, {prompt: "Choose a category" }, input_html: { class: "dropdown-toggle" } %>
Category.all Should be Modelname.all