如何在 select2 中 select 选项使用选项组或按索引

Question

我有一个 select2 使用这样的选项组：

<optgroup label="Line Number">
    <option data-order="asc">Orderline</option>
    <option data-order="desc">Orderline</option>
</optgroup>
<optgroup label="Order Date">
    <option data-order="asc">Order Date</option>
    <option data-order="desc">Order Date</option>
</optgroup>
<optgroup label="Ship Date">
    <option data-order="asc">Ship Date</option>
    <option data-order="desc">Ship Date</option>
</optgroup>

我想以编程方式 select 第二个选项 OrderLine desc。

Select2 文档显示了如何 select 基于 val() 但我不知道如何在此处应用它。

$('#sortby').val('???').trigger('change.select2');

我无法真正更改 select2 的结构，因为它已用于其他项目。

我想触发更改事件，因为在处理程序中发生了很多处理。

如果我可以 select 基于索引，那也很好。

感谢

Answer 1

<select id="sortby">
   <optgroup label="Line Number">
       <option data-order="asc">Orderline</option>
       <option data-order="desc">Orderline</option>
   </optgroup>
   <optgroup label="Order Date">
       <option data-order="asc">Order Date</option>
       <option data-order="desc">Order Date</option>
   </optgroup>
   <optgroup label="Ship Date">
       <option data-order="asc">Ship Date</option>
       <option data-order="desc">Ship Date</option>
   </optgroup>
</select>

//////////////Select ntn option of select element///////////////

var selectElement=$("#sortby");
function select_ntn_Option(index) {
   $('#sortby option[selected="selected"]').removeAttr('selected');
   selectElement.val(null);
   $('#sortby option:eq('+index+')').attr('selected','selected');
   selectElement.trigger('change');
}
select_ntn_Option(5);

//////////////Select ntn option by group title///////////////

var selectElement=$("#sortby");
function select_ntn_Option_ByGroupTitle(groupTitle,index) {
    $('#sortby option[selected="selected"]').removeAttr('selected');
    selectElement.val(null);
    $('#sortby>optgroup[label="'+groupTitle+'"]>option:nth-child('+index+')').attr('selected','selected');
    selectElement.trigger('change');
}
select_ntn_Option_ByGroupTitle('Ship Date',2);

//////////////Select last option by text value/////////////////

var selectElement=$("#sortby");
function selectLastOptionByTextValue(value) {
    $('#sortby option[selected="selected"]').removeAttr('selected');
    selectElement.val(null);
    $('#sortby option').filter(function () { return $(this).html() == value; }).last().attr('selected','selected');
    selectElement.trigger('change');
 }
selectLastOptionByTextValue('Order Date');

//////////////Select last option by group title/////////////////

var selectElement=$("#sortby");
function selectLastOptionByGroupTitle(value) {
    $('#sortby option[selected="selected"]').removeAttr('selected');
    selectElement.val(null);
    $('#sortby>optgroup[label="'+value+'"] option').last().attr('selected','selected');
    selectElement.trigger('change');
}
selectLastOptionByGroupTitle('Ship Date');

如何在 select2 中 select 选项使用选项组或按索引

How to select option in select2 that uses option groups or by index

javascript

jquery

jquery-select2