buildItems 构建地区级联选项的选择完成后的回调实现

发布：2024-07-10 15:02分类：前端模板评论：1浏览：130

前端 js 实现代码：

``` 
layui.use(['buildItems','cascader'], function(){ //追加第三方扩展 cascader
	...
	layui.buildItems.build({
		gid: gid,
		...
		data: [
			...
			{name:"areaid",id:"area_id",type:"text",title:"地区1",value:"",must:true},
			...
		]
	});
	//在构建完成后调用第三方扩展渲染 地区级联
	layui.cascader.render({
		elem: "#area_id", //这里要为上面构建项中的ID
		data: cityData, // 数据
		itemHeight: '260px', // 下拉列表每一项高度
		filterable: true, //开启搜索
		changeOnSelect: true, //是否点击每项选项值都改变, 如果设置为 false 则需要选择完成后才触发 onChange
		onChange: function(vals,data){console.log(vals,data)}, //数据选择完成的回调

renderFormat:function(labels,values){console.log(labels,values)},  // 选择后用于展示的函数
		clearable: true,  // 是否支持清除
		clearAllActive: false,  // 清除所有选中
		disabled: false,   // 是否禁用
		trigger: 'click',  // 次级菜单触发方式
		reqData: function(values, func, data){console.log(values, func, data);},  // 自定义获取数据的方法
		notFoundText: '没有匹配数据',  // 搜索列表为空时显示的内容
		reqSearch: function(value, func, mDataList){console.log(value, func, mDataList)},  // 自定义搜索的方法
		onVisibleChange: function(flag){console.log(flag)},  // 展开和关闭弹窗时触发
	});
	...
	// 提交表单
	form.on('submit(xyz)',function(data){
		...
		return false;
	});
});
```

地区级联

wsldgl1 楼
2024-08-27 17:33

赞

0 回复 (0)

发布帖子

作者信息

: veitool; 等级：Lv3; 积分：11683; 真我而为 ~

buildItems 构建地区级联选项的选择完成后的回调实现

发布：2024-07-10 15:02分类：前端模板评论：1浏览：130

作者信息

最近热帖