首页 文章

Select2不显示所选值

提问于
浏览 次
33

Select2加载我列表中的所有项目成功，这是我在页面加载时尝试选择特定值时发现的问题 . 例：

::将select2放在特定的html元素中，即使加载了所有项目，也不会选择任何值 .

$('#my_id').select2();

::当页面加载时我试图显示所选的特定项目，但是没有按预期工作，因为即使选中，select2也不会显示它 .

$('#my_id').val('3'); //select the right option, but doesn't render it on page loads.

如何在页面加载时弹出选定的选项？

提前致谢 .

更新

::我如何加载所有select2项目（对不起，它的玉，而不是纯HTML）：

label(for='category') Category
    span.required *
select(id='category', style='width:230px', name='category')
    option(value='') - Select -
    each cat in categories
        option(value='#{cat.id}') #{cat.description}

P.S . ：列表中的所有项目都已加载 .

::我如何初始化select2：

只需将以下行代码放在我的javascript上即可成功：

$('#category').select2();

::我如何选择特定值：

  • 第一次尝试：
$('#category').select2(
    {
        initSelection: function(element, callback) {
            callback($('#field-category').val());
        }
    }
);
  • 第二次尝试：
$('#category').val($('#field-category').val());

P.S . ： #field-category 的值为隐藏输入字段，工作正常 .

多谢你们！

jquery-select2

7 回答

  • 49

    您需要使用initSelection选项来设置初始值 .

    如果使用预定义的 select 元素来创建select2，则可以使用以下方法

    $('select').select2().select2('val','3')

    演示：Fiddle

    回复于
  • 26

    设置val后添加触发器更改：

    $('#my_id').val('3').trigger('change');
    回复于
  • 0

    解决此问题的一种非常简单的方法是：

    //Step1: Here assuming id of your selectbox is my_id, so this will add selected attribute to 1st option
$('#my_id option').eq(0).prop('selected',true);

//Step2: Now reinitialize your select box

//This will work, if you haven't initialized selectbox
$('#my_id').select2();

    要么

    //This will work, if you have initialized selectbox earlier, so destroy it first and initialise it
$('#my_id').select2('destroy').select2();
    回复于
  • 0

    在Select2 4.0及更高版本中不推荐使用here initSelection .

    使用Select2 4.0.0这对我有用：

    $('#my_id').select2({val:3});

    HT：@Kokizzu

    回复于
  • 0

    这里是如何使select2中的 val 只选择相应的元素 . 由于某种原因，select2不提供按ID查找选择的功能 .

    在里面：

    $("#thing").select2({data:sources, initSelection: function(item, callback) {
  // despite select2 having already read the whole sources list when you 
  // do .val(n) you have to explicitly tell it how to find that item again.
  var to_be_selected = null;
  $.each(sources, function(index, thing) {
    if (thing.id == item.val()) {
      to_be_selected = thing;
      return;
    }
  })
  callback(to_be_selected);
}})

    普通代码

    // to load the thing with id==3 from the initial sources list.
$("#thing").select2({'val': 3})
    回复于
  • 2

    我遇到同样的问题，这对我有用：

    Using Select2 4.0.0
$("#slect_id").val('3').trigger("change")
    回复于
  • 0

    对我来说，我在数据集中发送选定的仍然默认选项未被选中 . 我必须做类似下面的事情才能让它发挥作用 -

    $(".select").select2({
    data: data_names
});
data_names.forEach(function(name) {
    if (name.selected) {
        $(".select").select2('val', name.id);
    }
});
    回复于

相关问题