Select 2 个选项不 Select

Select 2 option not Selectable

我正在使用 select 2 框来显示一些表单选项。数据来自 ajax 请求,我将选项附加到 select2。问题是当我附加选项时,我确实在下拉列表中看到了它们,但不能 select 它们。

这是我正在使用的代码。

    $('#vehiclegroup-vehiclegroup_clientid').on('change',
    $('#vehiclegroup-vehiclegroup_clientid'),function(){

    var clientType = $('#vehiclegroup-vehiclegroup_clienttype').val();
    var company = $('#vehiclegroup-vehiclegroup_clientid').val();
    $.ajax({

        divId: divids[1],
        url: "index.php?r=vehiclegroup/getvehiclegroups",
        data: {'company': company , 'clientType': clientType},
        method: 'GET',
        success: populateUser

    })
}); 

populateUser 函数的代码

  function populateUser(data)
  {


   $(this.divId).empty();

   var newUser;
   var userList = data['list'];

   for (var client in userList )
   {
     newUser = "<option value=" + client + ">" +
        userList[client] + "</option>";

     $(this.divId).append(newUser);


   }
}

我对同一页面上的另一个 select2 框使用了相同的功能,并且工作正常。

编辑:

我的Select2初始化代码如下

<?= $form->field($model, 'vehiclegroup_parentid')->widget(Select2::classname(),
        [
            'data' => [],
            'language' => 'en',
            'options' => ['placeholder' => 'Select SubGroup Name'],
            'pluginOptions' => ['allowClear' => true],
        ]
    )->label('SubGroup'); ?>

确保你的 select2 初始化

<?= $form->field($model, 'vehiclegroup_parentid')->widget(Select2::classname(),
    [
        'data' => [],
        'language' => 'en',
        'options' => ['placeholder' => 'Select SubGroup Name'],
        'pluginOptions' => ['allowClear' => true],
    ]
)->label('SubGroup'); ?>

是在您的 ajax 请求完成之后,而不是在此之前。您的问题是您的 select2 在您将选项附加到 select2 之前已初始化,因此 select2 将无法识别您稍后添加的选项。

我解决了这个问题。我无法 select 第一个选项,首先我需要 select 任何其他选项,然后它变得 select 可用。我搜索了一下,这是因为即使在附加选项之后,您也需要触发更改。

   $(this.divId).select2().trigger('change');