2016-10-03 98 views
0

我已經HAML像這樣:設定輸入值 - 問題與HAML

.form-group 
    .col-sm-3.control-label 
    = f.label :trial, "Free Trial Offered" 
    %span.tipsy{"data-toggle" => "tooltip", title: t("campaigns.services_form_free_trial_help")} 
     = link_to content_tag(:i, "", class: 'glyphicon glyphicon-question-sign'), '#' 
    .col-sm-4 
    = f.select :trial, [['Yes', 'true'], ['No', 'false']], {}, class: 'selectpicker mandatory' 

這將創建下列HTML:

<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> 

正如你不能簡單的下拉列表中創建的,但而是一個複雜的按鈕和下拉組合。我希望能夠設置上述值的另一個輸入字段然而,典型的方法,如jQuery的更改處理程序不工作,因爲我不能使用id等來確定何時下拉更改。任何人都可以建議我如何實現這一目標。

我也在考慮將兩個模型屬性與一個下拉列表關聯,以便根據一個選擇將它們設置爲相同的值,但不確定這是否可能。

回答

0

似乎您使用的是bootstrap-select,這是該庫生成的代碼,與HAML無關。

即使它產生了很多羣衆演員,你仍然可以使用更改事件爲正常:

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