Rails form won't select default value

2019-08-26 03:30发布

问题:

Rails 4.0 Ruby 2.0, SimpleForm 3.1.0.rc2

Why isn't the default value selected in the first example when It is selected in the second example? Both examples are in the same form. More to the point, I suppose, is how do I fix it? Thanks.

<%= f.input(:location_id, {input_html: {value: @car.location}, collection: Location.all.order("name").collect{|c| [c.name, c.id]}, prompt: "Location?"}) %>

<select id="car_location_id" class="select optional form-control form-control" value="Rcving" name="car[location_id]">
<option value="">Location?</option>
‌<option value="7">Manager</option>
‌<option value="9">Rcving</option>
‌<option value="8">Return</option>
‌<option value="10">RollBack</option>
‌<option value="6">Stock</option>
</select>

<%= f.input(:ymm_year_id, {input_html: {value: @car.year}, collection: YmmYear.all.order("year desc").collect{|c| [c.year, c.id]}, prompt: "Year?"}) %>

<select id="car_ymm_year_id" class="select optional form-control form-control" value="2013" name="car[ymm_year_id]">
<option value="9">2015</option>
‌<option value="10">2014</option>
‌<option value="8" selected="selected">2013</option>
‌<option value="7">2012</option>
‌<option value="6">2011</option>
‌<option value="5">2010</option>
‌<option value="2">2009</option>
‌<option value="4">2008</option>
‌<option value="1">2007</option>
‌<option value="3">2006</option>
‌<option value="13">2005</option>
‌<option value="17">2004</option>
‌<option value="14">2003</option>
‌<option value="11">2002</option>
‌<option value="16">2001</option>
‌<option value="15">2000</option>
‌<option value="12">1999</option>
</select>

The form is:

<div class="span8">
  <%= simple_form_for [:admin, @car],
                      defaults: {label: false},
                      html: {class: 'form-vertical'},
                      wrapper: :vertical_form,
                      wrapper_mappings: {
                              check_boxes: :vertical_radio_and_checkboxes,
                              radio_buttons: :vertical_radio_and_checkboxes,
                              file: :vertical_file_input,
                              boolean: :vertical_boolean
                      } do |f| %>
      <%= f.input(:stock_number, {input_html: {value: @car.stock_number},  disabled: true, autocomplete: :off, placeholder: 'Stock number?'}) %>
      <%= f.input(:ymm_year_id, {input_html: {value: @car.year}, collection: YmmYear.all.order("year desc").collect{|c| [c.year, c.id]}, prompt: "Year?"}) %>
      <%= f.input(:ymm_make_id, {input_html: {value: @car.make}, collection: YmmMake.makes(@car.ymm_year_id).collect{|c| [c.make, c.id]}, prompt: "Make?"}) %>
      <%= f.input(:ymm_model_id, {input_html: {value: @car.model}, collection: YmmModel.models(@car.ymm_make_id).collect{|c| [c.model, c.id]}, prompt: "Model?"}) %>
      <%= f.association(:color, {input_html: {value: @car.color}, autocomplete: :off, prompt: 'Color?'}) %>
      <%= f.input(:location_id, {input_html: {value: @car.location}, collection: Location.all.order("name").collect{|c| [c.name, c.id]}, prompt: "Location?"}) %>
      <div class="col-xs-6 col-sm-3">
        <br/>
        <%= f.button :submit %>
        <br/><br/>
      <%= link_to 'Delete Car', admin_car_path(@car), class: 'btn btn-warning', data: {confirm: 'Are you sure?'}, :method => :delete %>
      </div>
  <% end %>
</div>

Example JQuery running with form:

$("select[name='car[ymm_year_id]']").change(function () {
    // send a GET request to /ymm_makes with the 'year' parameter
    $.getJSON("/ymm_makes", {year: $(this).val()}, function (data) {
        var options_html = ['<option value="">Make?</option>'];
        // iterate over the JSON that we received back; each entry is one 'ymm_make'
        $.each(data, function (index, make) {
            if (index = 0) {options_html.push('<option value="">Make?</option>');}
            // make a new <option> tag for each make and push it into the options_html array
            options_html.push("<option value='" + make.id + "'>" + make.make + "</option>");
        });
        // put all our generated <options> tags into the <select> tag
        $('select#car_ymm_make_id').html(options_html.join('')).prop('disabled', false);
    });
});

EDIT: Modified code using variable without id:

<%= f.input(:location, {collection: Location.all.order("name").collect { |c| [c.name, c.id] }, prompt: "Location?"}) %>
<select id="car_location" class="select optional form-control form-control" name="car[location]">
<option value="7">Manager</option>
<option value="9">Rcving</option>
<option value="8">Return</option>
<option value="10">RollBack</option>
<option value="6">Stock</option>
</select>

回答1:

Because the location variable is polymorphic, there is no "belongs to" association from car. Therefore, value will not be set. To get this to happen, I developed a JQuery that fires on ready to grab the value, which is actually the ID of the select, and set the value, as follows:

<%= f.input(:location_id, {input_html: {value: @car.location_id}, collection: Location.all.order("name").collect { |c| [c.name, c.id] }, prompt: "Location?"}) %>

$("select[name='car[location_id]']").ready(function () {
    // Obtain the value attribute and set val parameter
    var location = $('#car_location_id').attr("value");
    $("#car_location_id").val(location);
});

Kudos to janfoeh for leading me to this. OBTW, I tried this all using the location variable but the select needed the ID.