layui 第三方组件平台

返回首页 发布组件

根据下拉框选择不同,生成不同的输入框,目前应用于多条件下拉选择时,只支持生成三种输入框:input、select、date。

文档

版本:v1.1.0
说明:根据下拉框选择不同,生成不同的输入框,目前应用于多条件下拉选择时,只支持生成三种输入框:input、select、date。
日期:2018-12-03
更新:
1、第一次查询完,切换选项后,查询时不会带有之前的条件。
2、完善下拉框,可以使用接口请求数据。
3、可以启用清空按钮,默认不启用,reset:false,改为true就可以。

效果图:



使用方法:
html
<div id="condition"></div>
js
layui.config({
base : ../../layui_exts///模块所在路径
}).extend({
selectC: 'selectC',//模块名
}).use(['selectC' ], function() {
var selectC = layui.selectC;

/**动态条件控件**/
var condition = selectC({
elem: "#ID", //标签ID,带#号
number: 1, //数量
reset:false,//清空按钮,默认不启用
options: [{ //select下拉选项
type: "",//input
name: "",//标签的name属性
elemName: ""//名称
}, {
type: "",//select
name: "",//标签的name属性
elemName: "",//名称
data: [{//下拉框选项,直接赋值
name: "",//名称
value: ""//值
}
],
url: ""//数据请求地址,返回格式{
code:0成功,其他失败,
data:[{name:名称,value:值}],
msg:提示信息
}
}, {
type: "",//date
name: "",//标签的name属性
elemName: ""//名称
}
],
search:function(data){//查询按钮点击事件回调
console.log(data),//获取填写的条件json串
}
})
});