Rectangle 27 8

Finally found how to do it, configuring the wrapper this way adds the required div for bootstrap:

config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
  b.use :html5
  b.use :placeholder
  b.use :label
  b.wrapper :tag => 'div', :class => 'controls' do |ba|
    ba.use :input
    ba.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
    ba.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
  end
end

config.default_wrapper = :bootstrap

ruby on rails - How can I surround inputs with a div in simple_form wi...

ruby-on-rails simple-form
Rectangle 27 3

In the latest 2.1.0 branch of SimpleForm with 2.3.1.0 of bootstrap-saas, installed with bootstrap option, the collection_check_boxes method resulted in some spans to which applying the inline item wrapper class had no good effect.

I was able to get the form to line up perfectly using the standard input, collection, :as => :check_boxes methodology. Then the inline style worked perfectly:

<%= f.input :roles, :collection => valid_roles, :label_method => :last, :value_method => :first, :as => :check_boxes, :item_wrapper_class => 'inline'  %>

My roles happen to be a simple array of arrays with value, label. Hope this helps.

ruby on rails - Align checkboxes for f.collection_check_boxes with Sim...

ruby-on-rails checkbox simple-form
Rectangle 27 0

Shot in the dark, but maybe an initializer that sets up the prepend wrapper (like initializers/simple_form.rb or initializers/simple_form_bootstrap.rb) is not being run by Heroku, either because it's not checked into git, or because of some environment-specific logic in the initializers or environment files.

Hi Dan, cheers for having a stab at it. If one of those initializers wasn't running wouldn't the entire app just fall flat on it's face though because essentially every other page works perfectly fine (which all have an abundance of simple form and bootstrap code)? In any case, what would be the best way to check this?

If you can find the initializer that defines the :prepend wrapper, you could confirm that it's checked into git, and also add a quick p "ran the initializer" statement inside it, and then make sure that appears in the Heroku logs.

Bad news I'm afraid. The initializer (simple_form_bootstrap.rb) was the one holding the :prepend wrapper. I added the p "ran the..." to it and it is indeed in the heroku logs and in git. Slightly off topic but is there a way of overriding the default "We're sorry, but something went wrong." 500.html and displaying more 'development' errors on heroku? Maybe I can get more info from that?

consider_all_requests_local = true

I finally found the problem, cheers for the help. Seems like I got a bit unlucky with some regex not playing nicely with Heroku.

Rails, Twitter Bootstrap, Simple Form, Heroku - Odd error when using "...

heroku twitter-bootstrap ruby-on-rails-3.2 simple-form
Rectangle 27 0

Well after testing and some help from Dan I finally got to the bottom of it. Unfortunately, it seems to be quite localised to my situation though.

But just in case anyone stumbles across this, the error I had was the following:

ActionView::Template::Error (undefined method `source' for nil:NilClass):

That was in the log and was THE SAME when I followed Dan's advise to turn on error reporting on the production site (set consider_all_requests_local = true in config/environments/production.rb).

I thought that the error was being caused in the template, however, it was some validation rules in the model. The validation rules for me where some regex to stop the user starting the input with a certain string. They worked perfectly fine on my local, but Heroku really wasn't liking it!

I removed those validation rules and voila, my nice bootstrap add-on span was working perfectly.

Rails, Twitter Bootstrap, Simple Form, Heroku - Odd error when using "...

heroku twitter-bootstrap ruby-on-rails-3.2 simple-form
Rectangle 27 0

In my own experience with Bootstrap and simple_form / form_builder approach is that simple_form is not worth the trouble. There are just too many things that simple form has no answer for layout and control wise, some key black spots being classes on wrapper tags, selects with html attributes, or doing something simple like bootstrap button groups that mimic toggle/radio buttons. The i18n support in simple_form has also been a challenge, requiring a lot of duplication.

Also consider if server side rendering is the right approach for a modern application. I am transitioning from traditional rails/server-side rendering to a SPA (Single Page Application) model. To do this I'm using backbone.js and marionette with eco templates and coffeescript.

Architecturally the simple_form / rails form builder approach seems kind of flawed and within it has a lot of convoluted code for essentially building a html string fragment.

Well I say that is what view templates are for!

At the end of the day a view is composed from many different sub-view templates (eg partials), and I think it should go right down to control/field components. In contrast, the builder approach is always caught out with lack of support for different jquery components and is not really agile enough to keep pace.

I'd suggest using parameterised view templates/partials that codify the markup you want for each type of control/component or view construct in your app and simply compose them to get the layout you want. If you're doing this server side, you could wrap up all the render partial calls with some helpers for syntactical sweetness. If you're doing it client side with say eco templates, check the main page, you will see an example of defining and calling form building templates there.

Don't lock yourself into the capabilities of a form builder, use the boostrap documentation examples as the starting point for your templates and simply call them!

Rails 4 form builder with comprehensive support for Twitter Bootstrap ...

ruby-on-rails twitter-bootstrap twitter-bootstrap-3 formbuilder
Rectangle 27 0

This is not really well designed approach. Wrappers serve only for elements arrangement, namely for specifying their position.

For defining own styled element with custom HTML code use class Input instead. For example:

class CheckboxInput < SimpleForm::Inputs::BooleanInput
  def input
    # do whatever you want, for instance push your own class
    html_options = label_html_options.dup
    html_options[:class] ||= []
    html_options[:class].push('ui-checkbox')
    @builder.label(label_target, html_options) {
      build_check_box_without_hidden_field + template.tag(:span).html_safe
    }
  end
end
app/inputs
MySelectInput
https://github.com/plataformatec/simple_form/blob/master/lib/simple_form/inputs
https://github.com/plataformatec/simple_form/blob/master/lib/simple_form/inputs/collection_select_input.rb

In such way of nesting your input classes you are able to redefine whatever you want.

= simple_form_for @user, html: { class: 'form-horizontal' } do |f|
  = f.input :locked, as: :checkbox_input, wrapper: :inline
  # if you have this `inline` wrapper, of course
MySelectClass
:my_select_class

Remember that wrapper is not an input itself. It is common for all the inputs.

Custom wrapper for Bootstrap 3 dropdown in Rails simple form - Stack O...

ruby-on-rails twitter-bootstrap simple-form
Rectangle 27 0

I don't see how you would use the bootstrap switch script for a textfield. Nonetheless, some people might end up here with the same question as the one asked in the title.

You can simply copy the bootstrap wrapper and add the required class:

config.wrappers :bootstrap_switch, tag: 'div', class: "control-group", error_class: 'error', boolean_style: :inline do |b|
  b.use :html5
  b.use :placeholder
  b.use :label
  b.wrapper tag: 'div', class: 'controls' do |ba|
    ba.wrapper "switch", tag: 'div', class: 'switch' do |s|
      s.use :input
    end
    ba.use :error, wrap_with: { tag: 'span', class: 'help-inline' }
    ba.use :hint,  wrap_with: { tag: 'p', class: 'help-block' }
  end
end

This will create a nested div that has the class 'switch' (and thus stylable by the script). This inner wrapper has the namespace "switch", which enables us to set some options:

f.input :inputField, :wrapper => :bootstrap_switch, :switch_html => { :data => { on: "success", on_label: "<i class='icon-ok icon-white'></i>", off: "warning", off_label: "<i class='icon-remove'></i>" } }

Rails Simple Form Wrapper for Bootstrap Switch? - Stack Overflow

ruby-on-rails twitter-bootstrap simple-form
Rectangle 27 0

simple_form has a bootstrap plugin built in. Check it out here.

Rails Simple Form Wrapper for Bootstrap Switch? - Stack Overflow

ruby-on-rails twitter-bootstrap simple-form
Rectangle 27 0

In my own experience with Bootstrap and simple_form / form_builder approach is that simple_form is not worth the trouble. There are just too many things that simple form has no answer for layout and control wise, some key black spots being classes on wrapper tags, selects with html attributes, or doing something simple like bootstrap button groups that mimic toggle/radio buttons. The i18n support in simple_form has also been a challenge, requiring a lot of duplication.

Also consider if server side rendering is the right approach for a modern application. I am transitioning from traditional rails/server-side rendering to a SPA (Single Page Application) model. To do this I'm using backbone.js and marionette with eco templates and coffeescript.

Architecturally the simple_form / rails form builder approach seems kind of flawed and within it has a lot of convoluted code for essentially building a html string fragment.

Well I say that is what view templates are for!

At the end of the day a view is composed from many different sub-view templates (eg partials), and I think it should go right down to control/field components. In contrast, the builder approach is always caught out with lack of support for different jquery components and is not really agile enough to keep pace.

I'd suggest using parameterised view templates/partials that codify the markup you want for each type of control/component or view construct in your app and simply compose them to get the layout you want. If you're doing this server side, you could wrap up all the render partial calls with some helpers for syntactical sweetness. If you're doing it client side with say eco templates, check the main page, you will see an example of defining and calling form building templates there.

Don't lock yourself into the capabilities of a form builder, use the boostrap documentation examples as the starting point for your templates and simply call them!

Rails 4 form builder with comprehensive support for Twitter Bootstrap ...

ruby-on-rails twitter-bootstrap twitter-bootstrap-3 formbuilder
Rectangle 27 0

f.label
f.email_field
f.input
<%= f.label :email %>
<%= f.email_field :email %>

with

<%= f.input :email %>

ruby on rails - Using simple form for with bootstrap: bootstrap wrappe...

ruby-on-rails twitter-bootstrap simple-form
Rectangle 27 0

If you just need a standard bootstrap layout with your forms you could just generate the proper wrappers via simple forms generator. Maybe you have to rename your simple_form.rb initializer before (to simple_form.rb.backup for example) and merge your configuration with the generated one if you have other things in there besides bootstrap config code.

rails generate simple_form:install --bootstrap

We are using Rails 3.2 which only works with simple_form 2.x. Only simple_form 3 supports bootstrap 3. So it seems that we still need to find a monkey patch for this width issue for simple_form.

Format of page view messed up after upgrading to Bootstrap 3 in Rails ...

ruby-on-rails twitter-bootstrap simple-form
Rectangle 27 0

I found a really simple solution for Bootstrap 3 checkboxes. Assuming you already have the bootstrap 3 wrapper configured, all I had to do is add a custom input in app/inputs as checkbox_input.rb:

class CheckboxInput < SimpleForm::Inputs::BooleanInput
  # this exists to make the default 'boolean' css class in the form-group to be 'checkbox' instead
end
= f.input :remember_me, :as => :checkbox if devise_mapping.rememberable?

This will change the css boolean on the form-group to be checkbox instead, which will get the proper styling.

radio-inline
class RadioInlineInput < SimpleForm::Inputs::CollectionRadioButtonsInput

  # by default, this omits labels.  You should use f.label before this to stick a label where you would like.
  def initialize(builder, attribute_name, column, input_type, options = {})
    super(builder, attribute_name, column, :radio_buttons, {label: false}.merge(options))
  end

  def item_wrapper_class
    'radio-inline'
  end
end
= f.label :frequency
= f.input :frequency, collection: @membership_plan.interval_frequencies, as: :radio_inline

simple form - Bootstrap 3 + simple_forms checkboxes - Stack Overflow

simple-form twitter-bootstrap-3