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>