首页 >web前端 >H5教程 >Knockoutjs+select2 人员搜索功能代码分享

Knockoutjs+select2 人员搜索功能代码分享

巴扎黑
巴扎黑原创
2017-07-21 14:07:472225浏览

 

HTML:

 

 

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); //这里初始化
                   }
               }
           })

 

 

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

 

以上是Knockoutjs+select2 人员搜索功能代码分享的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn