How to style the inline label in Simple Form? - ruby-on-rails

I have a Simple Form checkbox which uses both a regular field label and an inline label:
<%= f.input :remove_default_template,
label: 'Advanced Option',
inline_label: "Remove Header, Footer, and Department Name"
%>
And I need to add styling to the inline label. How can I do this? I would expect something following this pattern to work:
<%= f.input :remove_default_template,
label: 'Advanced Option',
inline_label: "Remove Header, Footer, and Department Name",
inline_label_html:
input_html: {class: "input_class"}, # THIS works
wrapper_html: {class: "wrapper_class"}, # THIS works
label_html: {class: "label_class"}, # THIS works
inline_label_html: {class: "inline_label_class"} # THIS DOES NOT WORK!!!
%>
but the final line doesn't work:
inline_label_html: {class: "inline_label_class"}
Since Simple Form doesn't seem to support this option (at least under the name I expected, nor anything else that I could find), how can I accomplish the same goal?

You might want to have a hint, not an inline label.
Then you can write a wrapper, which allows doing something like this
<%= f.input :subdomain, input_wrapper_html: { class: 'col-sm-4' } %>
And then your hints will be inline.
Please check here https://github.com/plataformatec/simple_form/issues/1035

Related

How to change label of simple form input

I Have a code in my project like
<div class="form-inputs">
<%= f.input :twitter %>
</div>
It gives label as Twitter in my website. How it produce label with out giving label parameter. I want to change label to something else like Tweet it.
You can add label in very simple way
<%= f.input :twitter, label: 'Tweet it' %>
Check this simple_form usage
If you want to disable label
<%= f.input :input_field_name, label: false %>
Add custom class to label
<%= f.input :field_name, label_html: { class: 'my_class' } %>

Rails text_field object_name with arguments

How to pass arguments through text_field form helper.
Eg.:
<%= f.text_field :title(#language), class: 'form-control', placeholder: 'Item Title' %>
Result:
syntax error, unexpected '(',
You can try this code:
<%= f.text_field :title, class: 'form-control', placeholder: 'Item Title' %>
If you are trying to pass data to make your text_field display it in the placeholder, you can:
<%= f.text_field :title, class: 'form-control', placeholder: #language.your_class_method %>
Note here that the first parameter of the form helper is the attribute of the model you want to fill.
If you want to display the placeholder in a different language, you need to use as I mentioned, and make sure your_class_method properly transform the placeholder in the language needed.
If you are trying to pass additional information through the form to the controller, you can use an additional hidden field like:
<%= f.hidden_field :title, #language.your_class_method %>
Hope this helps!
If not, provide more information about "passing arguments through text_field form helper" because I'm not sure if I got that right.

Rails: Simple Form Custom Label Not Working

I'd like to create a custom label for a simple form field. For some reason, the below code isn't creating that label. It's still using the default label. I must be missing something easy.
Simple Form 3.1
<%= simple_form_for "#" do |f| %>
<%= f.input :street, label: "Custom Label" %>
...
<% end %>
How can I create a custom label for my inputs in Simple Form?
You need to use a label helper along with your input helper:
<%= simple_form_for "#" do |f| %>
<%= f.label :street, 'Custom label' %>
<%= f.input :street, as: :string, label: false %>
<% end %>
You can also directly specify input types ie. f.text_field - More info : http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html
You can now pass a label as argument. So the syntax as shown in the question (from 2015) now works:
<%= f.input :street, label: "Custom Label" %>
See the "Usage" section of the readme.

Simple_form inputs are too long

As always with Ruby on Rails I use simple_form gem to handle forms in more elegant and, well, simple way. But i have this problem, that string inputs are not generated properly. i mean they work as they are supposed to, but they are just extremely long, like totally out of my screen. it isn't normal behaviour is it? should i apply any special css for this? or maybe there is some other solution?
This form i have looks like this:
= simple_form_for #book, url: books_path, method: :post do |f|
= f.input :title, label: false, placeholder: "title"
= f.input :author, label: false, placeholder: "author"
= f.input :isbn, label: false, placeholder: "ISBN"
= f.input :publishing_date, label: false, placeholder: "Publishing date"
= f.input :amount, label: false, placeholder: "Amount"
= f.submit class: "btn btn-success"
Other that this i just put 'gem "simple_form"' to the Gemfile and thats it.
There is a good answer I found from typing simple_form width:
{:maxlength =>2,:style=> 'width: 20px'}%>
from this answer:
Rails Simpleform setting the width of a form input element

Semantic ui with simple_form

tell me how to configure simple_form. I would like to use the checkbox of semantic ui, but when I wrap checkbox in the class, he becomes active, that is, visually it is, but when you click the check box is not activated.
= simple_form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f|
.ui.three.column.middle.aligned.relaxed.grid.basic.segment
.column
.column
.column
.ui.form.segment
#marg.field= f.label :email, 'Email'
#marg.field=f.input :email, placeholder: 'Email', autofocus: true, label: false
#marg.field= f.label :password, 'Пароль'
= f.input :password, :required => false, placeholder: 'Пароль', label: false
#marg.ui.toggle.checkbox
= f.input :remember_me, as: :boolean if devise_mapping.rememberable?
#marg= f.button :submit, 'Войти!', class: 'small ui blue submit button'
http://i.imgur.com/C8Wn4K9.png
Please try it
= f.input :remember_me, as: :boolean, boolean_style: :inline
A simpler way to do this is to create a custom simple form wrapper. Here is a blogpost which describes how to add the wrapper: http://pranavsingh.me/semantic-ui-simple-form-wrapper/
The above configuration will automatically add all the essential classes semantic form classes, and also adds wrappers to create proper checkbox fields. Below is an example:
= f.input :published, label: "Published?",
hint: "If you are not ready to go live yet, keep this site unpublished.",
wrapper: :ui_toggle_checkbox
Here's what I had to do (the accepted answer got me on the right track, but didn't fully fix the issue):
In the config/initializers/simple_form.rb file, change
config.boolean_style = :nested
to
config.boolean_style = :inline
This prevents Simple Form from wrapping the input tag in the label tag (essentially inserting a tag between the '.ui .checkbox' div and the input, which breaks Semantic's checkbox functionality).
In the app/assets/javascripts/application.js file:
$('.ui.checkbox').find('input').checkbox();
My form now displays checkboxes correctly and passes the appropriate value when submitted.
Here is another option (to just fix one checkbox) -
In a _form.html.erb partial:
<div class="inline field">
<div class="ui checkbox">
<%= my_form.input :my_input, label: 'My Label', as: :boolean, boolean_style: :inline %>
</div>
</div>
In the application.js file:
$('.ui.checkbox').find('input').checkbox();

Resources