Styles ComboBox Bootstrap

0

I have problems with a comboBox , generated with ruby . I can not see why you are not taking the Bootstrap styles comboBox Brand .

The form is _form.html.erb

<%= form_with(model: cotizacion, scope: :cotizacion, local:true, class: "form-inline") do |form| %>
  <div class="form-group">
    <%= form.select :marca, 
          options_for_select([["SUBARU", "T"], ["KIA", "S"]], 
          class: "combobox form-control" %>
  </div>
  <div class="form-group">
    <select class="combobox form-control" name="inline">
      <option value="" selected="selected">Select a State</option>
      <option value="AL">Alabama</option>
      <option value="AK">Alaska</option>
      <option value="AZ">Arizona</option>
    </select>
  </div>
<% end %>

The difference in styles is reflected in the following image:

The idea is to get the same style of the comboBox Select State and until now I get the style of comboBox Subaru .

Thank you very much for your help !!!

    
asked by Sebastian Campos Davila 03.08.2017 в 00:09
source

2 answers

3

The problem is that you are not assigning the style correctly; i.e. you are assigning it in the options, not in select .

This is because the helper select is defined 1 in a different way than the other helpers :

select(object, method, choices = nil, options = {}, html_options = {}, &block)

As you can see, the method accepts two hashes , one for additional options ( options = {} ) and another for html options ( html_options = {} ); in the latter is where you must pass the attribute class .

Since you are not passing any additional options, you must pass that empty hash , and then pass the hash with the html options; for example:

<%= form.select :marca,
      options_for_select([["SUBARU", "T"], ["KIA", "S"]]), 
      {},
      { class: "combobox form-control" } %>

1 You can see the documentation of the method (in English) at this link .

    
answered by 03.08.2017 / 14:01
source
1

You did not send the entire form, but I see a couple of errors that may be causing the problem. First you have these 4 div:

                     <div class="container">
                     <div class="row">
                     <div class="col-md-2">
                     <div class="form-inline">
                     <div class="form-group">

of which you are only closing 3:

                 </div> 
                 </div> 
             </div>

then you have a form_with that generates a tag <form> and within this later you put a <form class="form-inline"> , which is not correct since the form does not must be nested . I believe that a closer approximation to what you are looking for, obviously excluding the "receive offers" button and other elements that you left out of the code that you show, would be something like this:

<%= form_with(model: cotizacion, scope: :cotizacion, local:true, class: "form-inline") do |form| %>
  <div class="form-group">
    <%= form.select :marca, options_for_select([["SUBARU", "t"], ["KIA", "s"]], class: 'combobox form-control') %>
  </div>
  <div class="form-group">
    <select class="combobox form-control" name="inline">
        <option value="" selected="selected">Select a State</option>
        <option value="AL">Alabama</option>
        <option value="AK">Alaska</option>
        <option value="AZ">Arizona</option>
    </select>
  </div>
<% end %>

PS: The word is "style", not "stylo".

    
answered by 03.08.2017 в 01:19