使用f.select值填充f.hidden_​​field

Question

我正在研究如何使用f.select字段的值填充hidden_​​field但是我遇到了困难。我打算使用javascript但是从我的haml创建的html很难为我希望传递值的select分配一个id。

= f.select :trial, [['Yes', 'true'], ['No', 'false']], {}, :id => "free-trial", class: 'selectpicker mandatory'

这会生成以下html

<div class="col-sm-4">
  <select class="selectpicker mandatory" id="free-trial" name="campaign[trial]" style="display: none;">
    <option value="true">Yes</option>
    <option value="false" selected="selected">No</option>
  </select>
  <div class="btn-group bootstrap-select mandatory">
    <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" data-id="free-trial" data-original-title="" title="">
      <span class="filter-option pull-left">No</span>&nbsp;
      <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" role="menu" style="max-height: 133px; overflow-y: auto; min-height: 0px;">
      <li rel="0">
        <a tabindex="0" class=""> 
          <span class="text">
            Yes
          </span>
          <i class="icon-ok check-mark"></i>
        </a>
      </li>
      <li rel="1" class="selected">
        <a tabindex="0" class="">
          <span class="text">No</span>
          <i class="icon-ok check-mark"></i>
        </a>
      </li>
    </ul>
  </div>
</div>

这个html在显示时实际上是两个选择一个隐藏了ID并且第二个显示没有id关联的。因此，单击可见选择意味着关联的jquery不会触发。

Answer 1

如果我理解正确，你需要从select到hidden_​​input的catch值。你可以使用jquery来做到这一点：

$('#free-trial').on('change', function(){
  var val = $(this).val();
  $('#your_hidden_input').attr('value', val);
}