1,添加select2 样式 参考（https://select2.org/ ）
2,Html:
<select id="txtType" name="Type" class="form-control select2" multiple="multiple">
</select>
3,jquery
@section scripts{
$(document).ready(function () {
var selectUpload = {
method: function () {
$.ajax({
type: "get",
url: "/Backstage/SelecType",
success: function (SelecList) {
for (var i = 0; i < SelecList.length; i++) {
var id = SelecList[i].Id;
var type = SelecList[i].英雄类型;
console.log('英雄类型 load success');
$("#txtType").append("<option value='" + id + "'>" + type + "</option>");
$('.select2').select2({
allowClear: true,
language: "zh-CN"
});
}
}
})
}
}
selectUpload.method();
}
});
封装function
效果图：
点击添加
4， jquery 动态加载：
$.ajax({
type: "post",
url: "/Backstage/GetTypeIds",
data: { Id: rowdata.Id },
success: function (typeIds) {
console.log(typeIds);
$('#txtType').val(typeIds).trigger('change'); （typeIds 后台返回的是 List<int>类型 ）
}
});
效果图：
后台加载出来
