從下拉按鈕

Question

我需要從下拉按鈕編程（JavaScript的）選擇一個元素以編程方式選擇的一種元素：

  <div class="form-group"> 
      <label class="col-lg-3 control-label">Button</label> 
      <div class="col-lg-9"> 
       <div class="btn-group m-r"> 
       <button data-toggle="dropdown" class="btn btn-md btn-default dropdown-toggle"> 
        <span class="dropdown-label" data-placeholder="Please select">Option 1</span> 
        <span class="caret"></span> 
       </button> 
       <ul class="dropdown-menu dropdown-select"> 
        <li id="properties_form_1" class="active"><a href="#"><input type="radio" name="d-s-c-1">Option 1</a></li> 
        <li id="properties_form_2"><a href="#"><input type="radio" name="d-s-c-1">xxx</a></li> 
        <li id="properties_form_3"><a href="#"><input type="radio" name="d-s-c-1">xxxx</a></li> 
        <li id="properties_form_4"><a href="#"><input type="radio" name="d-s-c-1">xxx</a></li> 
        <li id="properties_form_5"><a href="#"><input type="radio" name="d-s-c-1">xxxxx-Pair</a></li> 
       </ul> 
       </div> 
      </div> 
      </div> 

[UPDATE] 我曾嘗試以下：

order_form_div.find("[id^='properties_form_']").each(function(){ 
    console.log("id: " + $(this).attr('id')); 
    $(this).removeClass('active'); 
}); 
order_form_div.find("#" + item.productType).addClass('active'); 

它會使正確的項目處於活動狀態，但「選項1」中的文本不會更新。所以，不是手動改變這個文本，我認爲有任何優雅的方法來做到這一點。

Answer 1

一個瞎猜：

// deactivate all 
$('.dropdown-menu li').removeClass('active'); 

// the id of the element to select 
var selected = 'properties_form_2'; 

// set active class 
$('#' + selected).addClass('active'); 
// check radio-button 
$('#' + selected + '.active input').prop('checked', true); 

Answer 2

一旦你打開選定的屬性給你希望的選項被選中，運行

$('.dropdown-menu').selectpicker('refresh'); 

這應該更新的按鈕。 （可能需要在btn-group上運行它，從您的結構中不確定）