如何设置jquery select2的选定值？

99

这属于select2版本4之前的代码

我有一个简单的代码，select2从ajax获取数据

$("#programid").select2({
  placeholder: "Select a Program",
  allowClear: true,
  minimumInputLength: 3,
  ajax: {
    url: "ajax.php",
    dataType: 'json',
    quietMillis: 200,
    data: function (term, page) {
      return {
        term: term, //search term
        flag: 'selectprogram',
        page: page // page number
      };
    },
    results: function (data) {
      return {results: data};
    }
  },
  dropdownCssClass: "bigdrop",
  escapeMarkup: function (m) { return m; }
});

该代码有效，但是，我需要像在编辑模式下一样在其上设置一个值。当用户第一次选择一个值时，它将被保存，当他需要编辑该值时，它必须出现在同一选择菜单（select2）中以选择先前选择的值，但我找不到方法。

更新：

HTML代码：

<input type="hidden" name="programid" id="programid" class="width-500 validate[required]">

Select2编程访问不适用于此功能。

javascript  php  jquery  ajax  jquery-select2 
— 清除两者
source
您应该可以只在html中设置选定的值，也可以使用$("#programid").val()
— 爆炸药
@ExplosionPills负值，我也尝试过获得空白值。我应该如何使用programid.val（）？我从服务器获取了值，然后需要将其设置为select2的此隐藏字段。
— 2014年
@ClearBoth不知道我是否明白你的意思。您是否正在尝试将Select2组件的“ selected”值设置为AJAX检索结果之一？
— 2014年
@AnPhan是的，有办法吗？
— 2014年
@ClearBoth有。在下面检查我的答案。
— 2014年

Answers:

61

要动态设置Select2组件的“选定”值：

$('#inputID').select2('data', {id: 100, a_key: 'Lorem Ipsum'});

其中第二个参数是具有期望值的对象。

更新：

这确实有效，只是要注意在新的select2中，标准select2对象中的“ a_key”是“文本”。所以：{id: 100, text: 'Lorem Ipsum'}

例： 

$('#all_contacts').select2('data', {id: '123', text: 'res_data.primary_email'});

感谢@NoobishPro

— 安潘
source
1
我正在尝试仅使用id id select2（'val'，'1'），但无法正常工作。。谢谢
— ClearBoth 2014年
6
这确实有效，只是要注意在新的select2中，标准select2对象中的“ a_key”是“文本”。所以：{id：100，文字：“ Lorem Ipsum”}
— NoobishPro 2015年
2
在v4上也一样。一直在拉我的头发。我认为不使用JavaScript解决方案是不可能的。现在正在寻找另一个jQuery / Bootstrap Select2下拉列表（花了2天的时间摆弄每种可能的方法-没什么快乐！）
— MC9000，2016年
29
选择二V4：$('#inputID').val(100).trigger('change') 见select2.github.io/...
— 保罗
@NoobishPro＆An Phan-感谢您的回答和评论
— Sinto
104

SELECT2 <V4

步骤1：HTML

<input name="mySelect2" type="hidden" id="mySelect2">

步骤2：创建Select2的实例

$("#mySelect2").select2({
      placeholder: "My Select 2",
      multiple: false,
      minimumInputLength: 1,
      ajax: {
          url: "/elements/all",
          dataType: 'json',
          quietMillis: 250,
          data: function(term, page) {
              return {
                  q: term,
              };
          },
          results: function(data, page) {
              return {results: data};
          },
          cache: true
      },
      formatResult: function(element){
          return element.text + ' (' + element.id + ')';
      },
      formatSelection: function(element){
          return element.text + ' (' + element.id + ')';
      },
      escapeMarkup: function(m) {
          return m;
      }
});

步骤＃3：设置所需的值

$("#mySelect2").select2('data', { id:"elementID", text: "Hello!"});

如果使用不带AJAX的select2，则可以执行以下操作：

<select name="mySelect2" id="mySelect2">
  <option value="0">One</option>
  <option value="1">Two</option>
  <option value="2">Three</option>
</select>
/* "One" will be the selected option */
$('[name=mySelect2]').val("0");

您也可以这样做：

$("#mySelect2").select2("val", "0");

SELECT2 V4

对于select2 v4，您可以直接附加一个选项，如下所示：

<select id="myMultipleSelect2" multiple="" name="myMultipleSelect2[]">
    <option value="TheID" selected="selected">The text</option>                                                                   
</select>

或使用JQuery：

var $newOption = $("<option selected='selected'></option>").val("TheID").text("The text")
 
$("#myMultipleSelect2").append($newOption).trigger('change');

其他例子

$("#myMultipleSelect2").val(5).trigger('change');
— lop
source
3
触发器（'更改'）; 是重要的组成部分
— mihkov
$（“＃mySelect2”）。select2（“ val”，“ 0”）-这将触发值更改的jquery事件。如何防止这种情况发生。通常，当用户提交表单时，完成后，我会重置所有表单数据。重置不会重置select2。使用select2（“ val”，“ 0”）将触发更改，这很疯狂，因为用户没有采取任何行动。
— rbk rbk '18
— Ryan
表彰为.trigger（ '变更'）
— JP Dolocanog
23

HTML：

<select id="lang" >
   <option value="php">php</option>
   <option value="asp">asp</option>
   <option value="java">java</option>
</select>

JavaScript：

$("#lang").select2().select2('val','asp');

jsfiddle

— 艾哈迈德·塔拉涅（Ahmad Tarawneh）
source
2
如何通过文本而不是val设置
— Rizwan Patel
问题是在加载AJAX调用后如何执行此操作。在这种情况下，此答案不起作用。
— MC9000，2016年
这将触发select2值更改，如果您有此事件要处理，它将很奇怪，并且它在没有用户执行的情况下触发
— 跳线rbk
17

同样，正如我尝试过的那样，当在select2中使用ajax时，在select2 中设置新值的编程控制方法对我不起作用！现在，我编写以下代码来解决问题：

$('#sel')
    .empty() //empty select
    .append($("<option/>") //add option tag in select
        .val("20") //set value for option to post it
        .text("nabi")) //set a text for show in select
    .val("20") //select option of select2
    .trigger("change"); //apply to select2

您可以在此处的链接中测试完整的示例代码：https : //jsfiddle.net/NabiKAZ/2g1qq26v/32/
在此示例代码中，有一个ajax select2，您可以使用按钮设置新值。

显示代码段

— 纳比·卡兹
source
我正在使用不同的displayKey和其他东西（虽然是个好主意）-这有助于我对Codeception进行完美的验收测试
— MonkeyMonkey '16
2
当然，这很乏味，但是，就像每个人都发现Select2 v4一样，它根本做不到设置默认选择这样简单而又荒谬的方法
— MC9000 2016年
我发现此答案是制作select2 v4-ajax select的唯一方法。
13 
var $option = $("<option selected></option>").val('1').text("Pick me");

$('#select_id').append($option).trigger('change');

尝试此附录，然后选择。在AJAX调用时不重复该选项。

— 吉格斯
source
var $ option = $（“ <选择的选项> </ option>”）。val（'1'）。text（“ Pick me”）; $（'＃select_id'）。append（$ option）.trigger（'change'）;
— 吉格斯
谢谢。已确认适用于4.0.0版（ajax调用）的作品
— 哈利勒
另一个确认成功的ajax版本4。
— 一位编码员，
如果您将可搜索框与ajax一起使用，这是正确的解决方案。这个为我工作了2019
— Eric Skiff
12

我确实喜欢这个

$("#drpServices").select2().val("0").trigger("change");
— 阿诗
source
2
请提供一些解释，以帮助用户理解您的代码如何工作并回答OP的问题。
— 伊万
@Ivan，我正在这样做$（“＃drpServices”）。val（“ 0”）; 它不会在select2下拉列表中选择分类单元，为了同时影响值和文本，我们需要触发select2的触发更改功能。这对我来说是完美的。希望用户能理解。
— 芦之
9

在当前版本上select2， v4.0.1您可以像这样设置值：

var $example = $('.js-example-programmatic').select2();
$(".js-programmatic-set-val").on("click", function () { $example.val("CA").trigger("change"); });

// Option 2 if you can't trigger the change event.
var $exampleDestroy = $('.js-example-programmatic-destroy').select2();
$(".js-programmatic-set-val").on("click", function () { $exampleDestroy.val("CA").select2('destroy').select2(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.min.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css" rel="stylesheet" />

using "trigger(change)"
<select class="js-example-programmatic">
  <optgroup label="Alaskan/Hawaiian Time Zone">
    <option value="AK">Alaska</option>
    <option value="HI">Hawaii</option>
  </optgroup>
  <optgroup label="Pacific Time Zone">
    <option value="CA">California</option>
    <option value="NV">Nevada</option>
    <option value="OR">Oregon</option>
    <option value="WA">Washington</option>
  </optgroup>
  <optgroup label="Mountain Time Zone">
    <option value="AZ">Arizona</option>
    <option value="CO">Colorado</option>
    <option value="ID">Idaho</option>
    <option value="MT">Montana</option>
    <option value="NE">Nebraska</option>
    <option value="NM">New Mexico</option>
    <option value="ND">North Dakota</option>
    <option value="UT">Utah</option>
    <option value="WY">Wyoming</option>
  </optgroup>
  <optgroup label="Central Time Zone">
    <option value="AL">Alabama</option>
    <option value="AR">Arkansas</option>
    <option value="IL">Illinois</option>
    <option value="IA">Iowa</option>
    <option value="KS">Kansas</option>
    <option value="KY">Kentucky</option>
    <option value="LA">Louisiana</option>
    <option value="MN">Minnesota</option>
    <option value="MS">Mississippi</option>
    <option value="MO">Missouri</option>
    <option value="OK">Oklahoma</option>
    <option value="SD">South Dakota</option>
    <option value="TX">Texas</option>
    <option value="TN">Tennessee</option>
    <option value="WI">Wisconsin</option>
  </optgroup>
  <optgroup label="Eastern Time Zone">
    <option value="CT">Connecticut</option>
    <option value="DE">Delaware</option>
    <option value="FL">Florida</option>
    <option value="GA">Georgia</option>
    <option value="IN">Indiana</option>
    <option value="ME">Maine</option>
    <option value="MD">Maryland</option>
    <option value="MA">Massachusetts</option>
    <option value="MI">Michigan</option>
    <option value="NH">New Hampshire</option>
    <option value="NJ">New Jersey</option>
    <option value="NY">New York</option>
    <option value="NC">North Carolina</option>
    <option value="OH">Ohio</option>
    <option value="PA">Pennsylvania</option>
    <option value="RI">Rhode Island</option>
    <option value="SC">South Carolina</option>
    <option value="VT">Vermont</option>
    <option value="VA">Virginia</option>
    <option value="WV">West Virginia</option>
  </optgroup>
</select>

using destroy: 
<select class="js-example-programmatic">
  <optgroup label="Alaskan/Hawaiian Time Zone">
    <option value="AK">Alaska</option>
    <option value="HI">Hawaii</option>
  </optgroup>
  <optgroup label="Pacific Time Zone">
    <option value="CA">California</option>
    <option value="NV">Nevada</option>
    <option value="OR">Oregon</option>
    <option value="WA">Washington</option>
  </optgroup>
  <optgroup label="Mountain Time Zone">
    <option value="AZ">Arizona</option>
    <option value="CO">Colorado</option>
    <option value="ID">Idaho</option>
    <option value="MT">Montana</option>
    <option value="NE">Nebraska</option>
    <option value="NM">New Mexico</option>
    <option value="ND">North Dakota</option>
    <option value="UT">Utah</option>
    <option value="WY">Wyoming</option>
  </optgroup>
  <optgroup label="Central Time Zone">
    <option value="AL">Alabama</option>
    <option value="AR">Arkansas</option>
    <option value="IL">Illinois</option>
    <option value="IA">Iowa</option>
    <option value="KS">Kansas</option>
    <option value="KY">Kentucky</option>
    <option value="LA">Louisiana</option>
    <option value="MN">Minnesota</option>
    <option value="MS">Mississippi</option>
    <option value="MO">Missouri</option>
    <option value="OK">Oklahoma</option>
    <option value="SD">South Dakota</option>
    <option value="TX">Texas</option>
    <option value="TN">Tennessee</option>
    <option value="WI">Wisconsin</option>
  </optgroup>
  <optgroup label="Eastern Time Zone">
    <option value="CT">Connecticut</option>
    <option value="DE">Delaware</option>
    <option value="FL">Florida</option>
    <option value="GA">Georgia</option>
    <option value="IN">Indiana</option>
    <option value="ME">Maine</option>
    <option value="MD">Maryland</option>
    <option value="MA">Massachusetts</option>
    <option value="MI">Michigan</option>
    <option value="NH">New Hampshire</option>
    <option value="NJ">New Jersey</option>
    <option value="NY">New York</option>
    <option value="NC">North Carolina</option>
    <option value="OH">Ohio</option>
    <option value="PA">Pennsylvania</option>
    <option value="RI">Rhode Island</option>
    <option value="SC">South Carolina</option>
    <option value="VT">Vermont</option>
    <option value="VA">Virginia</option>
    <option value="WV">West Virginia</option>
  </optgroup>
</select>

<button class="js-programmatic-set-val">set value</button>
展开摘要

— 莫什·费
source
如何在不触发更改事件的情况下设置值？change事件触发我自己的事件处理程序，该事件处理程序用于用户手动更改值。
— enumag '16
另一种选择是destroy，然后再次..重新调用插件查看更新的代码..
— MOSH Feu的
有没有办法获取我最初传递给select2的选项，这样我就不必重复它们了？无论如何，这种解决方案似乎更像是黑客。
— enumag '16
当然是这样。根据文档的官方方式是触发变更事件。so that I wouldn't have to duplicate them为什么必须复制它们？当你这样做destroy的select时候，他的一切仍然在那里options。
— Mosh Feu
我的意思是传递给select2的选项：$example.select2({ ... this ... })
— enumag '16
6

对于Ajax，请使用$(".select2").val("").trigger("change")。那应该解决问题。

— 萨伯
source
6

我认为你需要initSelection功能

$("#programid").select2({
  placeholder: "Select a Program",
  allowClear: true,
  minimumInputLength: 3,
  ajax: {
    url: "ajax.php",
    dataType: 'json',
    quietMillis: 200,
    data: function (term, page) {
      return {
        term: term, //search term
        flag: 'selectprogram',
        page: page // page number
      };
    },
    results: function (data) {
      return {results: data};
    }
  },
  initSelection: function (element, callback) {
    var id = $(element).val();
    if (id !== "") {
      $.ajax("ajax.php/get_where", {
        data: {programid: id},
        dataType: "json"
      }).done(function (data) {
        $.each(data, function (i, value) {
          callback({"text": value.text, "id": value.id});
        });
        ;
      });
    }
  },
  dropdownCssClass: "bigdrop",
  escapeMarkup: function (m) { return m; }
});
— 艾哈迈德·塔拉涅（Ahmad Tarawneh）
source
可以了 但自版本4.0起已弃用
— VisualBean 2016年
5

的HTML

<select id="lang" >
   <option value="php">php</option>
   <option value="asp">asp</option>
   <option value="java">java</option>
</select>

JS

 $("#lang").select2().val('php').trigger('change.select2');

来源：https : //select2.github.io/options.html

— NaveenDA
source
5

在Select2 V.4中

用 $('selector').select2().val(value_to_select).trigger('change');

我认为应该可以

— 阿卡什·夏尔马
source
3 
    $("#select_location_id").val(value);
    $("#select_location_id").select2().trigger('change');

我用这个简单的代码解决了我的问题。其中#select_location_id是选择框的ID，值是select2框中列出的选项的值。

— 努曼·帕坦
source
2

安藩的答案对我有用：

$('#inputID').select2('data', {id: 100, a_key: 'Lorem Ipsum'});

但是添加更改会触发事件

$('#inputID').select2('data', {id: 100, a_key: 'Lorem Ipsum'}).change();
— 安德烈斯·罗德里格斯（Andres Rodriguez）
source
1
这样做时，我收到错误消息“ Uncaught TypeError：$（...）。select2（...）。change不是一个函数（...）”。我认为Select2的4.x版本是不可能的-这里没有适用于ajax的东西。
— MC9000，2016年
2

您可以使用以下代码：

$("#programid").val(["number:2", "number:3"]).trigger("change");

其中“ number：2”中的2和“ number：3”中的3是对象数组中的id字段

— 哈米德·雷扎
source
1

有时， select2()将首先加载，这会使控件无法正确显示先前选择的值。延迟几秒钟可以解决此问题。

setTimeout(function(){                  
    $('#costcentreid').select2();               
},3000);
— 波尼玛
source
0

我做了这样的事情来预设select2 ajax下拉列表中的元素

      //preset element values
        $(id).val(topics);
       //topics is an array of format [{"id":"","text":""}, .....]
          setTimeout(function(){
           ajaxTopicDropdown(id,
                2,location.origin+"/api for gettings topics/",
                "Pick a topic", true, 5);                      
            },1);
        // ajaxtopicDropdown is dry fucntion to get topics for diffrent element and url
— 阿耶特·拉哈尼（Ajeet Lakhani）
source
0

您应该使用：

var autocompleteIds= $("#EventId");
autocompleteIds.empty().append('<option value="Id">Text</option>').val("Id").trigger('change');

// For set multi selected values
var data =  [];//Array Ids
var option =  [];//Array options of Ids above
autocompleteIds.empty().append(option).val(data).trigger('change');

// Callback handler that will be called on success
request.done(function (response, textStatus, jqXHR) {
    // append the new option
    $("#EventId").append('<option value="' + response.id + '">' + response.text + '</option>');

    // get a list of selected values if any - or create an empty array
    var selectedValues = $("#EventId").val();
    if (selectedValues == null) {
        selectedValues = new Array();
    }
    selectedValues.push(response.id);   // add the newly created option to the list of selected items
    $("#EventId").val(selectedValues).trigger('change');   // have select2 do it's thing
});
— Xman古典
source
0

如果使用输入框，则必须将“ multiple”属性设置为“ true”。例如，

<script>
    $(document).ready(function () {

        var arr = [{ id: 100, text: 'Lorem Ipsum 1' },
            { id: 200, text: 'Lorem Ipsum 2'}];

        $('#inputID').select2({
            data: arr,
            width: 200,
            multiple: true
        });
    });
</script>
— 阿伦·巴尼克（Arun Banik）
source
0

在select2 < version4有选择initSelection()进行远程数据加载，通过它可以用于输入设置的初始值作为编辑模式。

$("#e6").select2({
    placeholder: "Search for a repository",
    minimumInputLength: 1,
    ajax: { 
        // instead of writing the function to execute the request we use Select2's convenient helper
        url: "https://api.github.com/search/repositories",
        dataType: 'json',
        quietMillis: 250,
        data: function (term, page) {
            return {
                q: term, // search term
            };
        },
        results: function (data, page) {
            // parse the results into the format expected by Select2.
            // since we are using custom formatting functions we do not need to alter the remote JSON data
            return { results: data.items };
        },
        cache: true
    },
    initSelection: function(element, callback) {
        // the input tag has a value attribute preloaded that points to a preselected repository's id
        // this function resolves that id attribute to an object that select2 can render
        // using its formatResult renderer - that way the repository name is shown preselected
        var id = $(element).val();
        if (id !== "") {
            $.ajax("https://api.github.com/repositories/" + id, {
                dataType: "json"
            }).done(function(data) { callback(data); });
        }
    },
    formatResult: repoFormatResult, // omitted for brevity, see the source of this page
    formatSelection: repoFormatSelection,  // omitted for brevity, see the source of this page
    dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
});

源文档：Select2-3.5.3

— 赛拉姆·苏雷什（Sairam Suresh）
source
0

只是为了增加可能与我提出相同问题的其他人。

我试图设置动态加载选项（从AJAX）中的选定选项，并试图根据某些逻辑将其中一个选项设置为选定。

我的问题来了，因为我没有尝试根据需要与值匹配的ID来设置所选选项，而不是与名称匹配的值！

— 格伦
source
0

对于多个值，如下所示：

$("#HouseIds").select2("val", @Newtonsoft.Json.JsonConvert.SerializeObject(Model.HouseIds));

这将转化为这样的东西

$("#HouseIds").select2("val", [35293,49525]);
— 罗伯特·本尼
source
0

这可能有助于某人从AJAX加载select2数据，同时加载要编辑的数据（适用于单选或多选）：

在我加载表格/模型时：

  $.ajax({
        type: "POST",
        ...        
        success: function (data) {
          selectCountries(fixedEncodeURI(data.countries));
         }

调用以选择Select2的数据：

var countrySelect = $('.select_country');
function selectCountries(countries)
    {
        if (countries) {
            $.ajax({
                type: 'GET',
                url: "/regions/getCountries/",
                data: $.param({ 'idsSelected': countries }, true),

            }).then(function (data) {
                // create the option and append to Select2                     
                $.each(data, function (index, value) {
                    var option = new Option(value.text, value.id, true, true);
                    countrySelect.append(option).trigger('change');
                    console.log(option);
                });
                // manually trigger the `select2:select` event
                countrySelect.trigger({
                    type: 'select2:select',
                    params: {
                        data: data
                    }
                });
            });
        }
    }

如果您在编码方面遇到问题，可以根据需要进行更改：

function fixedEncodeURI(str) {
        return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']').replace(/%22/g,"");

    }
— 卡姆兰·乌尔·哈克（Kamran Ul Haq）
source
0

如果您要从ajax获取值，请在致电之前 

$("#select_location_id").val(value);
$("#select_location_id").select2().trigger('change');
展开摘要

在以下情况下使用jquery函数确认ajax调用已完成

$.when(ajax1(), ajax2(), ajax3(), ajax4()).done(function(a1, a2, a3, a4){
      // the code here will be executed when all four ajax requests resolve.
      // a1, a2, a3 and a4 are lists of length 3 containing the response text,
      // status, and jqXHR object for each of the four ajax calls respectively.
    });
展开摘要
如此处所述[ 等待所有jQuery Ajax请求完成？

— 胜利者旺吉
source
0

在@tomloprod的答案的基础上构建。您使用x-editable并有一个select2（v4）字段和需要预选的多个项目的可能性很小。您可以使用以下代码：

$("#select2field").on("shown", function(e, editable){
    $(["test1", "test2", "test3", "test4"]).each(function(k, v){
        // Create a DOM Option and pre-select by default~
        var newOption = new Option(v.text, v.id, true, true);
        // Append it to the select
        $(editable.input.$input).append(newOption).trigger('change');
     });
});

它在起作用：

var data = [
{
    id: 0,
    text: 'enhancement'
},
{
    id: 1,
    text: 'bug'
},
{
    id: 2,
    text: 'duplicate'
},
{
    id: 3,
    text: 'invalid'
},
{
    id: 4,
    text: 'wontfix'
}
];

$("#select2field").editable({
        type: "select2",
        url: './',
        name: 'select2field',
        savenochange: true,
        send: 'always',
        mode: 'inline',
        source: data,
        value: "bug, wontfix",
        tpl: '<select style="width: 201px;">',
        select2: {
            width: '201px',
            tags: true,
            tokenSeparators: [',', ' '],
            multiple: true,
            data:data
        },
        success: function(response, newValue) {
            console.log("success")
        },
        error: function(response, newValue) {
            if (response.status === 500) {
                return 'Service unavailable. Please try later.';
            } else {
                return response.responseJSON;
            }
        }
    });

var preselect= [
    {
        id: 1,
        text: 'bug'
    },
    {
    id: 4,
    text: 'wontfix'
}
];

 $("#select2field").on("shown", function(e, editable){
    $(preselect).each(function(k, v){
        // Create a DOM Option and pre-select by default~
        var newOption = new Option(v.text, v.id, true, true);
        // Append it to the select
        $(editable.input.$input).append(newOption).trigger('change');
     });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.min.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css" rel="stylesheet" />

<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/js/bootstrap-editable.min.js"></script>

<a id="select2field">bug, wontfix</a>
展开摘要

我猜想，即使您不使用x-editable也可以。我希望htis可以帮助某人。

— 雷尼尔
source
0

您可以使用以下代码：

    $('#country').select2("val", "Your_value").trigger('change');

输入您想要的值而不是Your_value

希望它会工作:)

— 解决精神
source
-2

好，易于：

document.getElementById("select2-id_city-container").innerHTML = "Your Text Here";

然后您更改id_city为所选的ID。

编辑：在格伦发表评论后，我意识到我应该解释它为什么以及如何为我工作：

我已经select2为表格做好了工作。我唯一无法做的就是在编辑时显示当前选定的值。它正在搜索第三方API，保存新记录并编辑旧记录。过了一会儿，我意识到我不需要正确设置值，只需设置字段内部的标签，因为如果用户不更改字段，则什么也不会发生。在搜寻并寻找许多遇到麻烦的人之后，我决定使用纯Javascript制作它。它奏效了，我发布了帮助某人的信息。我还建议为此设置一个计时器。

— 博纳费南多
source
这个答案很糟糕，甚至无法正确设置该值。
— 格伦（Glen）
对此我感到抱歉。我将编辑我的答案以解释为什么发布它。
— bonafernando
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.