Select2 后台分页(滚动分页)

cocosum

已于 2023-12-20 14:09:13 修改

阅读量2.2k

点赞数 1

分类专栏： JS/JavaScript/Bootstrap 文章标签： Select2 后台分页 Select2滚动分页 Select2 分页 select

于 2019-05-11 12:11:53 首次发布

本文链接：https://blog.csdn.net/qq_40058321/article/details/90107948

版权

JS/JavaScript/Bootstrap 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

/**
   小生不才.....
 * <link rel="stylesheet" href="static/js/components/select2/dist/css/select2.min.css" />
 *
 * <script src="static/js/components/select2/dist/js/select2.full.min.js"></script> // 一定要这个  full是完整的
 * <script src="static/js/components/select2/dist/js/i18n/zh-CN.js"></script>
 * 
 * 后台controller层
 * 
 * 主要看参数类型
   public List<UserPurseActivityType> listUserPurseActivityTypeLike(String activityName, Integer pageIndex, Integer pageSize) {
		List<UserPurseActivityType> list = userPurseActivityTypeService.listUserPurseActivityTypeLike(activityName, pageIndex, pageSize);
		return list;
	}
 * 
 * html 
 * 
 * 		<select id="purseActivity"  style="width:150px;"></select>
 * 
 * js 
 * 
 * 		// 定义select2组件
	$('#purseActivity').select2({
		placeholder: '搜索活动劵',
		language: "zh-CN",
		minimumInputLength: 1, // 最少输入N个字符才开始检索
		ajax:{
			url: 'userPurse/listUserPurseActivityTypeLike',
			type: "post",
			dataType: 'json',
			data: function(params) {
					// 传入后台的参数
					var data = {
						// 搜索框内输入的内容
						activityName: params.term,
	                    // 当前页
	                    pageIndex: 1,
	                    // 每页显示多少条记录，默认10条
	                    pageSize: 10
					};
					return data;
			},
			processResults: function (data, params) {
				console.log(params)
				params.page = params.page || 1;
				console.log(params.page);
				var resultData = [];
				// 如果没有查找的数据的时候 直接返回一空
				if (isZero(data.length)) {
					return {
		                results: resultData
		            };
				} else {
					for (var i = 0; i < data.length; i++) {
						resultData.push({'id': data[i].activityId, 'text': data[i].activityName});
					}
				}
			    return {
			    	// 最终返回结果集
			    	results: resultData,
			    	// 当我的结果集  等于我每页数量大小的时候，就说明 我还有下一页 pagination 是开启滚动也分
			    	pagination: {
			    		    more: (params.page * 10) == resultData.length
			    	}
			    };
			}
		},
		cache:false,
        escapeMarkup: function (markup) {
            // 字符转义处理
            return markup;
        }
	});
 * 
 * 
**/