inputs = %w[ | |
CollectionSelectInput | |
DateTimeInput | |
FileInput | |
GroupedCollectionSelectInput | |
NumericInput | |
PasswordInput | |
RangeInput | |
StringInput | |
TextInput | |
] | |
inputs.each do |input_type| | |
superclass = "SimpleForm::Inputs::#{input_type}".constantize | |
new_class = Class.new(superclass) do | |
def input_html_classes | |
super.push('form-control') | |
end | |
end | |
Object.const_set(input_type, new_class) | |
end | |
# Use this setup block to configure all options available in SimpleForm. | |
SimpleForm.setup do |config| | |
config.boolean_style = :nested | |
config.wrappers :bootstrap3, tag: 'div', class: 'form-group', error_class: 'has-error', | |
defaults: { input_html: { class: 'default_class' } } do |b| | |
b.use :html5 | |
b.use :min_max | |
b.use :maxlength | |
b.use :placeholder | |
b.optional :pattern | |
b.optional :readonly | |
b.use :label_input | |
b.use :hint, wrap_with: { tag: 'span', class: 'help-block' } | |
b.use :error, wrap_with: { tag: 'span', class: 'help-block has-error' } | |
end | |
config.wrappers :prepend, tag: 'div', class: 'form-group', error_class: 'has-error' do |b| | |
b.use :html5 | |
b.use :placeholder | |
b.wrapper tag: 'div', class: 'controls' do |input| | |
input.wrapper tag: 'div', class: 'input-group' do |prepend| | |
prepend.use :label , class: 'input-group-addon' ###Please note setting class here fro the label does not currently work (let me know if you know a workaround as this is the final hurdle) | |
prepend.use :input | |
end | |
input.use :hint, wrap_with: { tag: 'span', class: 'help-block' } | |
input.use :error, wrap_with: { tag: 'span', class: 'help-block has-error' } | |
end | |
end | |
config.wrappers :append, tag: 'div', class: 'form-group', error_class: 'has-error' do |b| | |
b.use :html5 | |
b.use :placeholder | |
b.wrapper tag: 'div', class: 'controls' do |input| | |
input.wrapper tag: 'div', class: 'input-group' do |prepend| | |
prepend.use :input | |
prepend.use :label , class: 'input-group-addon' ###Please note setting class here fro the label does not currently work (let me know if you know a workaround as this is the final hurdle) | |
end | |
input.use :hint, wrap_with: { tag: 'span', class: 'help-block' } | |
input.use :error, wrap_with: { tag: 'span', class: 'help-block has-error' } | |
end | |
end | |
config.wrappers :checkbox, tag: :div, class: "checkbox", error_class: "has-error" do |b| | |
# Form extensions | |
b.use :html5 | |
# Form components | |
b.wrapper tag: :label do |ba| | |
ba.use :input | |
ba.use :label_text | |
end | |
b.use :hint, wrap_with: { tag: :p, class: "help-block" } | |
b.use :error, wrap_with: { tag: :span, class: "help-block text-danger" } | |
end | |
# Wrappers for forms and inputs using the Twitter Bootstrap toolkit. | |
# Check the Bootstrap docs (http://getbootstrap.com/) | |
# to learn about the different styles for forms and inputs, | |
# buttons and other elements. | |
config.default_wrapper = :bootstrap3 | |
end |
This comment has been minimized.
This comment has been minimized.
nice work dude... thanks to save me the time. [= |
This comment has been minimized.
This comment has been minimized.
You're the man... many thanks! |
This comment has been minimized.
This comment has been minimized.
Working great for me too. Thank you. |
This comment has been minimized.
This comment has been minimized.
Thanks! I also added this line: |
This comment has been minimized.
This comment has been minimized.
Awesome. Thanks! |
This comment has been minimized.
This comment has been minimized.
Thanks for this! inputs = %w[
...
]
inputs.each do |input_type|
superclass = "SimpleForm::Inputs::#{input_type}".constantize
# . . .
Object.const_set(input_type, new_class)
end isn't it? |
This comment has been minimized.
This comment has been minimized.
Thanks! I have also made another wrapper for horizontal-forms: config.wrappers :bootstrap3_horizontal, tag: 'div', class: 'form-group', error_class: 'has-error',
defaults: { input_html: { class: 'form-group default_class' } } do |b|
b.use :html5
b.use :min_max
b.use :maxlength
b.use :placeholder
b.optional :pattern
b.optional :readonly
b.use :label, class: 'col-sm-5 control-label'
b.wrapper tag: 'div', class: 'col-sm-7' do |input_block|
input_block.use :input
input_block.use :hint, wrap_with: { tag: 'span', class: 'help-block' }
end
b.use :error, wrap_with: { tag: 'span', class: 'help-block has-error' }
end And to use it you can type: = simple_form_for @abc, :wrapper => :bootstrap3_horizontal, :html => { :class => 'form-horizontal' } do |form| |
This comment has been minimized.
This comment has been minimized.
For what it's worth, the initializer raised errors for me with ruby 1.9.2. Monkey patching the original classes worked for me: inputs.each do |input_type|
superclass = "SimpleForm::Inputs::#{input_type}".constantize
superclass.class_eval do
def input_html_classes_with_form_control
input_html_classes_without_form_control.push('form-control')
end
alias_method_chain :input_html_classes, :form_control
end
end |
This comment has been minimized.
This comment has been minimized.
Radio and checkbox buttons!!! |
This comment has been minimized.
This comment has been minimized.
Great piece of code, really helpful. Could you add a license info so that we know how can we use it? |
This comment has been minimized.
This comment has been minimized.
Thank you very much, works well |
This comment has been minimized.
This comment has been minimized.
Thanks. This is really awesome. @cmartin81 for some reason, the label is to the right of the input form? Is that what you get too? |
This comment has been minimized.
This comment has been minimized.
@dickyblue, I had same problem and couldn't get
to style correctly in boostrap3_horizontal. A different gist ended up helping me more, notice that defaults for |
This comment has been minimized.
This comment has been minimized.
@dickyblue i also had that problem. i updated @cmartin81's version slightly and added the error handling in the correct spot: config.wrappers :bootstrap3_horizontal, tag: 'div', class: 'form-group', error_class: 'has-error',
defaults: { input_html: { class: 'form-group default_class' } } do |b|
b.use :html5
b.use :min_max
b.use :maxlength
b.use :placeholder
b.optional :pattern
b.optional :readonly
b.use :label, wrap_with: { tag: 'div', class: 'col-md-2' }
b.wrapper tag: 'div', class: 'col-md-10' do |input_block|
input_block.use :input
input_block.use :hint, wrap_with: { tag: 'span', class: 'help-block' }
input_block.use :error, wrap_with: { tag: 'span', class: 'help-block has-error' }
end
end |
This comment has been minimized.
This comment has been minimized.
http://blog.plataformatec.com.br/2014/04/bootstrap-3-support-for-simple-form/ - Simple Form 3.1.0.rc1 with support to Bootstrap 3. |
This comment has been minimized.
This comment has been minimized.
This will unfortunately break Active Admin. However, the following approach works fine for me: inputs = %w[
CollectionSelectInput
DateTimeInput
FileInput
GroupedCollectionSelectInput
NumericInput
PasswordInput
RangeInput
StringInput
TextInput
]
inputs.each do |input_type|
"SimpleForm::Inputs::#{input_type}".constantize.class_eval do
alias_method :__input_html_classes, :input_html_classes
define_method(:input_html_classes) do
__input_html_classes.push('form-control')
end
end
end |
This comment has been minimized.
This comment has been minimized.
Thanks, this trick helped me. But I use config.wrapper_mappings = { boolean: :checkbox }
config.wrappers :checkbox, tag: :div, class: 'checkbox', error_class: 'has-error' do |b|
b.use :html5
b.use :label_input
b.use :hint, wrap_with: { tag: :p, class: 'help-block' }
b.use :error, wrap_with: { tag: :span, class: 'help-block text-danger' }
end When I use b.wrapper tag: :label do |ba|
ba.use :input
ba.use :label_text
end the inputs adds me a label automatically and just prepends the plain text. |
This comment has been minimized.
This comment has been minimized.
Thanks you very much |
This comment has been minimized.
THANKS.
Haven't tested at all but with 30 seconds work, my forms now look a bit more reasonable under TBS 3!