2 Star 28 Fork 9

不死鸟 / layselect

Create your Gitee Account
Explore and code with more than 8 million developers,Free private repositories !:)
Sign up
Clone or Download
Cancel
Notice: Creating folder will generate an empty file .keep, because not support in Git
Loading...
README.md

layselect

介绍

layui下拉框组件 layselect

软件架构

下载layselect后可直接放入layui/lay/modules/中当做原生组件使用,也可自行建立文件夹/modules/,layui使用的时候引用。

安装教程

  1. 直接下载放入工程

使用说明

  1. 直接放到layui/lay/modules/模块下作为原生组件
  2. 自定义目录如/modules/,layui.use之前声明使用 layui.config({ base: '../js/layui_exts/' }).extend({ regionSelect: 'regionSelect/regionSelect' }).use([''],function(){})
  3. 有问题可联系:872694792@qq.com
  4. 使用样例
layui.config({
	base:'js/modules/'
}).extend({
	layselect:'layselect'
}).use(['jquery','form','layselect'], function(){
	var select = layui.layselect,$=layui.jquery,form=layui.form;
		console.log(select);
		select.render({
			  elem:"#unit",
			  url:'json/groupshow.json',//归属类型
			  select:1,//默认选中索引
			  success:function(data){
				  //初始化完毕,data为绑定到组件上的数组集合
			  },
			  fail:function(e){
				  //失败时回调
			  },
			  format:function(data){
				  //对数据进行映射处理,需映射成:code,codeName,status,select,groupName,groupChildren
			  },
			  onselect:function(data){
				  //点击选中时触发,data为选中的value
			  }
		  });
		//映射案例
		select.render({
			  elem:"#forbiType",
			  url:'json/forbidden.json',//店铺列表
			  format:function(row){
				  return{
					  code:row.id,
					  status:row.status,
					  codeName:row.name
				  };
			  }
		});
		select.render({
			  elem:"#orderData",
			  //url:'',//归属类型
			  option:[
				  {code:'1',codeName:'1-第一个'},
				  {code:'2',codeName:'2-第二个'},
				  {code:'3',codeName:'3-第三个'},
				  {code:'4',codeName:'4-第四个',select:true},
				  {code:'5',codeName:'5-第五个'},
				  {code:'6',codeName:'6-第六个'}],
			  select:"0",//确认默认项:option内部select=true的优先级高于外部select指定索引,最终的默认选项是4-第四个
			  onselect:function(data){
				  layer.msg("选中了:"+data);
			  }
		});
});

API说明

属性 说明 默认值
url 获取数据的请求地址,返回标准JSON格式:{code:'',codeName:'',status:'',groupName:'',groupChilddren:[]} 条件必传,指定option时可不传
elem 绑定的元素ID 必传
data 请求URL携带的参数 非必传
type 请求URL的方式,默认get 非必传
option 元素数据,数组类型,用于不通过请求url获取数据,本地自动赋值,option指定这url可不穿 非必传
select 指定默认选择项 非必传
方法 说明 默认值
format 请求返回数据格式与标准格式不一致时做映射处理 非必传
success 请求成功时回调,返回绑定到组件的数组集合 非必传
fail 请求失败时回调,返回失败信息 非必传
onselect 点击选择时事件响应(如事件无响应,记得加lay-filter属性=id) 非必传

参与贡献

  1. Fork 本仓库
  2. 新建 Feat_xxx 分支
  3. 提交代码
  4. 新建 Pull Request

DEMO演示

  1. DEMO演示

Repository Comments ( 7 )

Sign in to post a comment

About

layui下拉框组件 expand collapse
JavaScript and 2 more languages
MulanPSL-2.0
Cancel

Releases

No release

layselect

Contributors

All

Activities

Load More
can not load any more
JavaScript
1
https://gitee.com/godbirds/layselect.git
git@gitee.com:godbirds/layselect.git
godbirds
layselect
layselect
master

Search