layui[扩展组件]-xmSelect下拉多选 (分页,ajax)

遇到问题:

1、请求两次

2、分页不成功

3、回传数据格式 字符串转数组

解决思路:

2、数据格式为数组

3、//remoteSearch: true 注释这行代码(解决请求两次问题 )

4、pageRemote: true(分页)

5、字符串转数组

var arr = "100203,100204,100206";

strArr = arr.split(",");

var newArr = []

newArr.push({name: strArr[i], value: strArr[i],});

demo1.setValue(newArr)

贴代码:

var demo1 = xmSelect.render({

el: '#demo1',

toolbar: {

show: true,

showIcon: true,

},

filterable: true,

paging: true,

pageSize: 15,

// remoteSearch: true,

pageRemote: true,

//数据处理

remoteMethod: function (val, cb, show, pageIndex) {

//val: 搜索框的内容, 不开启搜索默认为空, cb: 回调函数, show: 当前下拉框是否展开, pageIndex: 当前第几页

$.ajax({

url: "",

type: 'POST',

crossOrigin: true,

dataType: 'json',

cache: false,

async: true,

data: {

keywords: val,

page: pageIndex,

rows: 15

},

success: function (data) {

var TotalCount = data.totalCount;

var Pages = Math.ceil(TotalCount / 15);

console.log(Pages)

var res = data.data;

setTimeout(function () {

//需要回传一个数组

cb(res, Pages)

}, 100)

},

error: function (data) {

//这里是error的处理

cb([], 0);

updateAlert("调用异常!");

}

});

},

on: function(data){

//arr: 当前多选已选中的数据

//监听,选中的数据数量,为空则另一个字段可编辑,不为空则另一个字段可编辑

var arr = data.arr;

console.log(arr);

if(arr!=""){

document.getElementById('level').setAttribute("disabled", true);

}else{

document.getElementById('level').removeAttribute("disabled");

}

},

});

//var arr = "100203,100204,100206"; //字符串转带参数的数组

var arr = ' ';//这里写入回传的参数

if (arr != '') {

strArr = arr.split(",");

var newArr = []

for (var i = 0; i < strArr.length; i++) {

newArr.push({name: strArr[i], value: strArr[i],});

}

demo1.setValue(newArr)

}

image

image

image

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐