Question

我正在尝试使用select2下拉菜单填充更多字段。检查这个小提琴： http://jsfiddle.net/ws3tjp5f/

我也希望填充"Select extra"。但是价值不同。

现在我可以打印id＆amp;文字，我想存储和打印另一个值"extra"

HTML：

<input type="hidden" id="test" />
<p>Selected IDs: <input type="text" id="selectedID"/></p>
<p>Selected Options: <input typ="text" id="selectedText"/></p>
<p>Selected Extra Field: <input typ="text" id="selectedExtra"/></p>

JS：

var test = $('#test');
$(test).select2({
placeholder: "Choose",
data:[
    {id:0,text:"enhancement"},
    {id:1,text:"bug"},
    {id:2,text:"duplicate"},
    {id:3,text:"invalid"},
    {id:4,text:"wontfix"}
],
width: "300px"
});

$(test).change(function() {

var theID = $(test).select2('data').id;
var theSelection = $(test).select2('data').text;
var theExtra = $(test).select2('data').text;
$('#selectedID').val(theID);
$('#selectedText').val(theSelection);
$('$selectedExtra').val(theExtra);
});

Answer 1

我为此创建了一个Js Fiddle，你也有一个关于$（'$ selectedextra'）的拼写错误，它应该是$（'＃selectedextra'），基本上我只是在JSON数据上添加了一个新列叫'额外'。

    var test = $('#test');
    $(test).select2({
        placeholder: "Choose",
        data:[
            {id:0,text:"enhancement",extra:"one"},
            {id:1,text:"bug",extra:"two"},
            {id:2,text:"duplicate",extra:"three"},
            {id:3,text:"invalid",extra:"four"},
            {id:4,text:"wontfix",extra:"five"}
        ],
        width: "300px"
    });

    $(test).change(function() {

        var theID = $(test).select2('data').id;
        var theSelection = $(test).select2('data').text;
        var theExtra = $(test).select2('data').extra;

        $('#selectedID').val(theID);
        $('#selectedText').val(theSelection);
        $('#selectedExtra').val(theExtra);

    });

Answer 2

var theID = $(test).select2('data').id;
var theSelection = $(test).select2('data').text;
var theExtra = $(test).select2('data').text;
$('#selectedID').val(theID);
$('#selectedText').val(theSelection);
-->    $('#selectedExtra').val(theExtra);
});

这一行

$('#selectedExtra').val(theExtra);

如何在此select2表单上添加额外字段

2 个答案: