JQuery Select2標籤在表單加載

Question

我正在寫一個使用jQuery和多select2標籤工具的WebForm。用戶從下拉列表中選擇多個代理，保存並將數據作爲單個字符串以下面的管道分隔格式存儲到後端SQL數據庫：[AGENCY1 | AGENCY2 | AGENCY3]。

<input id="ddlAgency" type="hidden" class="form-control" value="" name="select2tag"/> 

加載窗體時，我能夠通過標籤來分析，但我如何才能如選擇2多形式的控制選擇它們來顯示（即：AGENECY1，AGENECY2，AGENECY3出現選擇標籤，而其他選項可以在下拉菜單中選擇）？

var agencySplit = row.INC_AGENCY.split("|"); 
for (var i = 0; i < agencySplit.length; i++) { 
    $('#ddlAgency').val(agencySplit[i]); //This Doesn't Work Like I Want It To 
} 

任何幫助，將不勝感激。

Answer 1

您需要將您的分割項中的項目追加爲option到您的select元素。

<select id="ddlAgency" style="width:300px" type="hidden" class="form-control" name="select2tag"/> 

$('select').select2(); 

var agency = "AGENCY1|AGENCY2|AGENCY3"; 
var agencySplit = agency.split("|"); 
for (var i = 0; i < agencySplit.length; i++) { 
    $('#ddlAgency').append("<option>" + agencySplit[i] + "</option>"); 
} 

http://jsfiddle.net/c1ozynyu/

如果做多選：

$('select').select2({multiple: true}); 

http://jsfiddle.net/c1ozynyu/1/

更新：（根據意見預先在列表中選擇項目）

<select id="ddlAgency" style="width:300px" type="hidden" class="form-control" name="select2tag"> 
    <option val="AGENCY1">AGENCY1</option> 
    <option val="AGENCY2">AGENCY2</option> 
    <option val="AGENCY3">AGENCY3</option> 
    <option val="AGENCY4">AGENCY4</option> 
    <option val="AGENCY5">AGENCY5</option> 
</select> 

var array = new Array(); 
var agency = "AGENCY1|AGENCY2|AGENCY3"; 
var agencySplit = agency.split("|"); 
for (var i = 0; i < agencySplit.length; i++) { 
    array.push(agencySplit[i]); 
} 
$('select').select2({multiple: true}).select2('val', array); 

http://jsfiddle.net/c1ozynyu/2/