PHP前端开发

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

百变鹏仔 2个月前 (10-18) #H5教程
文章标签 搜索功能

 

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

 

 

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