1.cshtml 创建一个 div
<div id="test4" class="demo-transfer"></div>
2.js 接收后台数据
//穿梭框数据列表
$.ajax({
url: '/ActionModule/ActionCMD/GetList',
method: 'GET',
dataType: 'JSON',
success: function (res) {
console.log("获得返回数据");
console.log(res);
//debugger;
data2 = res;
//显示搜索框
//数据格式解析
transfer.render({
elem: '#test4'
, title: ['左边穿梭框', '右边穿梭框']
, data: data2
, showSearch: true
, id: 'key123' //定义唯一索引
, parseData: function (res) {
return {
"value": res.id //数据值
, "title": res.name //数据标题,按返回数据字段名来
, "disabled": res.disabled //是否禁用
, "checked": res.checked //是否选中
}
}
, height: 200 //定义高度
});
}
})
//获取穿梭框值
var getData = transfer.getData('key123'); //获取右侧数据
//将穿梭框值数组拼接为字符串
for (var item in getData)
{
list += "'" + getData[item].value + "',";
}
list = joblist.substr(0, list.length - 1);//去掉最后一个逗号
3.后端
[HttpGet]
public ActionResult Getlist()
{
var list = bll.Getlist();//返回类型为DataTable
var json = Act.Utilities.JsonHelper.ToJson(list);//将datatable转成json,这里是自己写的方法转化
return Content(json);
}
版权声明:本文为qq_41757790原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。