Rails simple_form: custom input id - ruby-on-rails

I want to put several forms generated with Rails simple_form on a one page, and operate on them with javascript. However simple_form generated same ids for respective inputs in forms. Thus I want to replace generated id with my own.
Now I have a line:
<%= f.input :id, :as => :hidden, :html => {:value => #question.id} %>
and HTML output (for #question.id=1):
<input id="question_id" class="hidden" type="hidden" value="1" name="question[id]">
and I want to get:
<input id="question_id_1" class="hidden" type="hidden" value="1" name="question[id]">
question_id_1 is just an example. I want to be able to choose this id.
I use Rails 3 and simple_form 1.5.

You're almost there.
The trick is in specifying the :input_html.
<%= f.input :id, :as => :hidden,
:input_html => {
:value => #question.id,
:id => "question_id_1"
} %>

Related

rails multiple checkboxes in 1 db column. saves correctly but doesn't show as checked

Event saves the section id's in an array. But in the /events/1/edit view for a newly created event, the expected checkboxes are not checked. I'm guessing because the default for checkbox values is booleans.
Event.last.newsletters #=> ["108", "115", "116", "117", "118", ""]
I have a CRUD for Event. Each Event can belong to multiple Sections. I have this displayed as a collection of checkboxes with the simpleform gem.
<%= simple_form_for #event do |f| %>
...
<%= f.collection_check_boxes :newsletters, Section.all, :id, :name, :input_html => { :class => 'checkbox' } %>
This results in the following html:
<span><input id="event_newsletters_1" name="event[newsletters][]" type="checkbox" value="1" /><label class="collection_check_boxes" for="event_newsletters_1">Newsletter 1</label></span>
<span><input id="event_newsletters_2" name="event[newsletters][]" type="checkbox" value="2" /><label class="collection_check_boxes" for="event_newsletters_2">Newsletter 2</label></span>
etc. etc.
When I create a new event or edit an event, the newsletter values are saved properly in the model.
Try specify the param :checked:
<%= f.collection_check_boxes :newsletters,
Section.all,
:id,
:name,
:input_html => { :class => 'checkbox' },
:checked => #event.newsletters %>
Reference: how to preselect an association checkbox using simple_form
If you are using SimpleForm you can use this:
<%= f.input :newsletters, collection: Section.all, as: :check_boxes %>

Manually set the ID's of form input fields in a simpleform form?

Is it possible to overrule simpleform's naming of textfields within a form?
This:
= f.input_field :age_from,
Outputs in:
<input type="text" size="50" name="/people/search[query]" id="_people_search_query">
Should be
<input type="text" size="50" name="/people/search[query]" id="query">
I tried
* :name => "query"
* :id => "query"
to no avail
Like your other question html options should be passed in input_html hash in simple_form:
<%= f.input :age_from, ..., :input_html => { :id => 'my_id' } %> should work.
I think you need to pass it in the html attribute hash
html: {id: 'query'}

simple_form have form items appear in a row without a newline?

Would it be possible to write a wrapper or style simple_form so that form elements are next to each other all on one line?
What needed is like this:
search for: [ input text field ] country [ drop down textfield ] city [ drop down textfield ]
Im using
simple_form 2
twitter bootstrap 2
You currently can set .form-horizontal or .form-vertical, would the best way to get a "inline 1 row form elements display" by adding rules to CSS or create a simple_form wrapper?
Update some haml/css:
= simple_form_for(#session, :html => { :class => 'form-horizontal' }) do |f|
= f.input :age_from,
:collection => 18..60,
:default => 18,
:blank =>false,
:label => 'Age from',
:item_wrapper_class => 'inline',
:input_html => { :style => "width: 102px" },
= f.input :age_to,
:collection => 18..60,
:default => 25,
:blank => false,
:label => 'Age to',
:item_wrapper_class => 'inline',
:input_html => { :style => "width: 102px" }
Using the regular bootstrap css nothing more yet.
the item_wrapper_class is not working for a whole element just for like a single radio button in a collection.
I need a good way to wrap the complete collection elements inline ( age to and age from )
I can't add a comment to the person above because I don't have the reputation, but just grab the inputs by specifying the class of the level above, then use a mixin that you've giving form-control's styles to make it the same as form-control:
.form-group input {
#include form-control-styling
}
You can either use .form-horizontal (for me the easiest and clean solution) or write a custom input or custom form builders. Check the documentation at https://github.com/plataformatec/simple_form.
The latest version of bootstrap has a form-inline class.
= simple_form_for(#session, :html => { :class => 'form-inline' }) do |f|
You can also create custom wrappers. This is the markup from bootstrap's documentation:
<form class="form-inline" role="form">
<div class="form-group">
<label class="sr-only" for="exampleInputEmail2">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email">
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword2">Password</label>
<input type="password" class="form-control" id="exampleInputPassword2" placeholder="Password">
</div>
...
</form>
So, if you created a custom wrapper (something like):
SimpleForm.setup do |config|
config.wrappers :bootstrap, :tag => 'div', :class => 'form-group' do |b|
b.use :label
b.use :input
end
end
This should do most of what you need. The part that I still have not worked out is how to add 'form-control' class to the inputs.

Cant make form date_select hidden in rails

I am trying to create a form which loads upon a user clicking a date in a calendar, the form then is passed the date that is clicked through the URL and the controller assigns that date to the #date variable. I then create a date_select element and assign it the #date variable. This works fine but since I do not want the user to be able to edit the date in the form I want it to be hidden.
I pass these html options to the form but it doesn't seem to ever effect the HTML:
<%= f.date_select :date, :default => #date, :type => "hidden" %>
Am I missing something? I also tried passing it in an HTML hash :html => { :type = "hidden" } but that doesn't work either. Even when I try something different like :class => "something" it doesn't change the HTML. Is there something special about the date_select helper?
date_select accepts the options discard_day, discard_month and discard_year to do exactly what you are trying to achieve.
<%= f.date_select :date, { :discard_day => true, :discard_month => true, :discard_year => true } %>
Behind the scenes, it generates the following HTML code:
<input id="record_date_3i" name="record[date(3i)]" type="hidden" value="5" />
<input id="record_date_2i" name="record[date(2i)]" type="hidden" value="1" />
<input id="record_date_1i" name="record[date(1i)]" type="hidden" value="2012" />
No CSS tricks, no changes in your controllers.
Per the name, date_select generates <select> elements. In no version of (X)HTML does the select element support the type attribute. If you want a hidden form field then you should use the hidden_field helper, which generates <input type="hidden"> elements.
(To answer your implied question about using e.g. :class => 'something', the problem is that the options and html_arguments parameters must be two separate hashes, but if you do something like this:
<%= f.date_select :date, :default => #date, :class => 'something' %>
..the Ruby interpreter assumes that you have supplied a single hash, i.e. { :default => #date, :class => 'something' } (and really, can you blame it?), and since class isn't a valid key for the options hash it's ignored. Instead you have to make it obvious to Ruby that these are two separate parameters by doing something like this instead:
<%= f.date_select :date, :default => #date, { :class => 'something' } %>
<%# Hey Ruby, this is a different Hash! ----^ %>
See the difference? Of course you could go bonkers and be really obvious, e.g.:
<%= f.date_select(:date, { :default => #date }, { :class => 'something' }) %>
..but that's ugly and egregious so don't bother.)
You can put it inside a hidden div:
<div style="display: none;">
<%= f.date_select :date, :default => #date, :type => "hidden" %>
</div>
That will allow you to have all the fields and hidden you can also use for date and time select:
<div style="display: none;">
<%= f.datetime_select :date, :default => #date, :type => "hidden" %>
</div>

Rails: Using form_for multiple times (DOM ids)

I would like to use the form_for helper multiple times for the same model in the same page. But the input fields use the same ID attribute (in the HTML), so clicking on the label of a field in another form will select the same input in the first form.
Is there a solution besides settings all attributes manually via :for => "title_#{item.id}" and :id => "title_#{item.id}"?
Using Rails 3.0.9
You can use :namespace => 'some_unique_prefix' option. In contrast to :index, this will not change the value used in the name attribute.
It's also possible to use an array, e.g. when you have nested forms or different forms that happen to have some fields in common: :namespace => [#product.id, tag.id] or :namespace => [:product, #product.id]
I found the answer myself, one can pass a :index option to form_for. That string will be used in the id and for attributes:
<%= form_for #person, :index => #person.id do |f| %>
<%= f.label :name %>
<%= f.text_field :name %>
<%= f.submit %>
<% end %>
will parse
<form accept-charset="UTF-8" action="/person/11" class="edit_person" id="edit_person_11" method="post">
<!-- Hidden div for csrf removed -->
<label for="person_11_name">Name</label>
<input id="person_11_name" name="person[11][name]" size="30" type="text" />
<input name="commit" type="submit" value="Update Person" />
</form>
Notice it'll change the name of the inputs as well.
I believe you can add this param:
:html => { :id => 'id_i_want' }

Resources