HTML5技术

Knockoutjs+select2 人员搜索 - 馒头大汗

字号+ 作者:H5之家 来源:H5之家 2017-07-13 07:58 我要评论( )

HTML: select data-bind="options:{text:ICVInfo.Proje

 

HTML:

 <select data-bind="options:{text:ICVInfo.ProjectManager,value:ICVInfo.ProjectManager},optionsText:'text',optionsValue:'value',value:ICVInfo.ProjectManager" ></select>

 

javascript:

$('.PersonEmail').select2({
"separator": ",",
"maximumSelectionSize": 10,
"placeholder": "请选择用户",
"allowClear": false,
"maximumInputLength": 100,
"minimumResultsForSearch": "2",
"tags": false,
templateResult: function (repo) {
markup = repo.text;
return markup;
},
escapeMarkup: function (markup) { return markup; },
templateSelection: function (repo) {
return repo.text;
},

ajax: {
@*url: '@Url.Action("SelectUser", "CommercialReminder")', dataType: 'json', data: function (params) {*@
url: 'SelectUser',
dataType: 'json',
delay: 250,
data: function (params) {
return {
q: params.term, // search term
page: params.page
};
},
processResults: function (data, params) {
params.page = params.page || 1;

return {
results: data.items,
pagination: {
more: (params.page * 30) < data.total_count
}
};
},
cache: false,
type: 'post'
},
initSelection: function (element, callback) {
if (element.val() != null) {
var data = { id: element.val(), text: element.val() };
//alert(data.id);
callback(data); //这里初始化
}
}
})

 

 

目前只适合单选,多选目前还在配置,等测试通过后会继续放上来。

 

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 架构师之路--搜索业务和技术介绍及容错机制 - 静儿1986

    架构师之路--搜索业务和技术介绍及容错机制 - 静儿1986

    2017-06-26 12:00

  • Web 版 PowerDesigner (Canvas) 技术 - NetUML大数据搜索

    Web 版 PowerDesigner (Canvas) 技术 - NetUML大数据搜索

    2017-05-11 08:00

  • 郁金香搜索引擎的方案 - 静儿1986

    郁金香搜索引擎的方案 - 静儿1986

    2017-04-29 10:00

  • 前端实现搜索记录功能也就是天猫app历史记录存储方便浏览 - 今天的代码你撸了嘛

    前端实现搜索记录功能也就是天猫app历史记录存储方便浏览 - 今天的代

    2017-04-12 14:00

网友点评
y