Question

我喜欢哈哈：

<div class="form-group">
  <div class="col-sm-3 control-label">
    <label for="campaign_trial">Free Trial Offered</label>
    <span class="tipsy" data-toggle="tooltip" title="" data-original-title="Select whether or not you wish to offer a free trial with your service.">
      <a href="#"><i class="glyphicon glyphicon-question-sign"></i></a>
    </span>
  </div>
  <div class="col-sm-4">
    <select class="selectpicker mandatory" id="campaign_trial" name="campaign[trial]" style="display: none;">
      <option value="true" selected="selected">Yes</option>
      <option value="false">No</option>
    </select>
    <div class="btn-group bootstrap-select mandatory">
      <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" data-id="campaign_trial" data-original-title="" title="">
        <span class="filter-option pull-left">
          Yes
        </span>&nbsp;
        <span class="caret">
        </span>
      </button>
      <ul class="dropdown-menu" role="menu" style="max-height: 89px; overflow-y: auto; min-height: 0px;">
        <li rel="0" class="selected">
          <a tabindex="0" class="">
            <span class="text">
              Yes
            </span>
            <i class="icon-ok check-mark"></i>
          </a>
        </li>
        <li rel="1" class="">
          <a tabindex="0" class="">
            <span class="text">
              No 
            </span>
            <i class="icon-ok check-mark"></i>
          </a>
        </li>
      </ul>
    </div>
  </div>
</div>

这会创建以下html：

{{1}}

因为你不能创建简单的下拉列表，而是按钮和下拉列表的复杂组合。我希望能够将另一个输入字段设置为上述值，但是典型的方法（如jquery更改处理程序）不起作用，因为我无法使用id等来确定下拉列表何时更改。任何人都可以建议我如何实现这一目标。

我还考虑将两个模型属性与一个下拉列表相关联，以便根据一个选择将两个模型属性设置为相同的值，但不确定这是否可行。

Answer 1

似乎您正在使用bootstrap-select，这是此库生成的代码，与HAML无关。

即使它产生了很多额外内容，您仍然可以正常使用更改事件：

$(function() {
  $('#campaign_trial').on('change', function() {
    // do things
  });
})

根据选择的输入值设置输入值 - haml问题

1 个答案: