SELECT2 - >添加数据而不替换内容

时间:2014-02-23 12:53:07

标签: javascript jquery html jquery-select2

我已经看了一些其他线程,但没有一点具体。这不是我认为很难的事情,但我不知道该怎么做。

目前我正在使用Select2作为标记系统,并在其旁边我建议用户可以点击的标记,它将添加到框中。

相反,每个标签都会替换内容并自行添加。

我需要将添加内容添加到框中而不替换已存在的内容。

这是我的代码:

$(document).on('click', ".tag1", function () {
      var value = $(".tag1").html();
      console.log(value);
      $("#selectPretty").val([value]).trigger("change");
});
$(document).on('click', ".tag2", function () {
      var value = $(".tag2").html();
      console.log(value);
      $("#selectPretty").val([value]).trigger("change");
});

通过AJAX提取数据,并在每个建议的标签周围插入数据。

希望我足够清楚。

摘要:我希望能够点击每个“标记”并将其添加,而不是取代框中已有的标记。

由于

2 个答案:

答案 0 :(得分:14)

你应该能够做到这一点:

var test = $('#test');

$(test).select2({
    data:[
        {id:0,text:"enhancement"},
        {id:1,text:"bug"},
        {id:2,text:"duplicate"},
        {id:3,text:"invalid"},
        {id:4,text:"wontfix"}
    ],
    multiple: true,
    width: "300px"
});
var data = $(test).select2('data');
data.push({id:5,text:"fixed"});
$(test).select2("data", data, true); // true means that select2 should be refreshed

工作示例:http://jsfiddle.net/z96Ca/

答案 1 :(得分:5)

您正在使用val(mystuff)替换该值。您想要执行以下操作:

  1. 使用val()

    获取输入中的当前数据

    var dataOld = $('#selectPretty').val();

  2. 使用类似*

    的内容附加新数据

    var dataNew = dataOld.push(value);

  3. 将输入数据设置为新数据:

    $('#selectPretty').val(dataNew);

  4. * 这假设val()返回一个数组

    Docs