JQuery在表单加载时选择2个标记

JQuery Select2 Tags On Form Load

本文关键字：2个 选择 表单 加载 JQuery      更新时间：2023-09-26

我正在使用jquery和multi-select2标记工具编写WebForm。用户从下拉列表中选择多个机构，然后保存，数据将以以下管道分隔格式作为单个字符串存储到后端SQL数据库中：[AGENCY1|AGENCY2|AGENCY3]。

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

加载表单时，我可以解析标记，但如何使它们在select2多表单控件中显示为选定标记（即：AGENCE1、AGENCE2、AGENCE3显示为选定的标记，而其余选项则可在下拉列表中选择）？

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
}

如有任何帮助，我们将不胜感激。

您需要将拆分中的项作为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/

相关文章：