From e46c59f5a15d10b669bffaffeb51da6d5df7cee5 Mon Sep 17 00:00:00 2001 From: adminstart Date: Wed, 24 Oct 2018 19:42:51 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=BA=86table=E4=B8=8B?= =?UTF-8?q?=E5=B8=A6=E9=BB=98=E8=AE=A4where=E6=9D=A1=E4=BB=B6=E6=97=B6?= =?UTF-8?q?=E7=82=B9=E7=BB=84=E4=BB=B6input=E6=90=9C=E7=B4=A2=E9=BB=98?= =?UTF-8?q?=E8=AE=A4where=E6=B2=A1=E6=9C=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- demo/tableSelect.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/demo/tableSelect.js b/demo/tableSelect.js index 35e3ae4..bda5d51 100644 --- a/demo/tableSelect.js +++ b/demo/tableSelect.js @@ -183,8 +183,12 @@ layui.define(['table', 'jquery', 'form'], function (exports) { //关键词搜索 form.on('submit(tableSelect_btn_search)', function(data){ + var tablesearchwhere=tableSelect_table.config.where; + layui.each(data.field,function(key,val){ + tablesearchwhere[key]=val; + }); tableSelect_table.reload({ - where: data.field, + where: tablesearchwhere, page: { curr: 1 } -- Gitee From 86c1e8ee6c93bdde5d6052f6d03c119b891a314e Mon Sep 17 00:00:00 2001 From: adminstart Date: Thu, 25 Oct 2018 10:54:16 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E4=BF=AE=E5=A4=8Ddemo=E5=AE=8C=E6=95=B4?= =?UTF-8?q?=E6=80=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 2 +- demo/index.html | 303 +++++++++++++++++++++++++------------------- demo/tableSelect.js | 98 +++++++------- 3 files changed, 227 insertions(+), 176 deletions(-) diff --git a/.gitignore b/.gitignore index dc92603..cae3c6c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,2 @@ - +.idea .vscode/launch.json diff --git a/demo/index.html b/demo/index.html index 8e022e0..254f1e9 100644 --- a/demo/index.html +++ b/demo/index.html @@ -10,142 +10,191 @@ -
-
- -
- -
-
本地演示数据，分页选中和其他页一样，这不是BUG
+
+
+ +
+
-
- -
- -
+
本地演示数据，分页选中和其他页一样，这不是BUG
+
+
+ +
+
-
- -
-
-//开始使用
-var tableSelect = layui.tableSelect;
-tableSelect.render({
-	elem: '#demo',	//定义输入框input对象 必填
-	checkedKey: 'id' //表格的唯一建值，非常重要，影响到选中状态 必填
-	searchKey: 'keyword',	//搜索输入框的name值 默认keyword
-	searchPlaceholder: '关键词搜索',	//搜索输入框的提示文字 默认关键词搜索
-	table: {	//定义表格参数，与LAYUI的TABLE模块一致，只是无需再定义表格elem
-		url:'',
-		cols: [[]]
-	},
-	done: function (elem, data) {
-	//选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据 []
-	//拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
-	}
-})
-//默认值
-只需要在触发input上添加 ts-selected="1,2,3" 属性即可 值需与checkedKey对应
-
-
+
+
+ +
+ +
-
- -
-
- 更新时间线 -
-
    -
  • - -
    -
    10/18 Add 记住选中 / 赋默认选中值
    -
    -
    • -
  • - -
    -
    10/17 Add 多选分页选中
    -
    -
    • -
  • - -
    -
    10/08 Fix z-index / 边缘位置控制
    -
    -
    • -
  • - -
    -
    09/01 Add 搜索控制 / Add 双击选择
    -
    -
    • -
  • - -
    -
    08/31 完成初始版本
    -
    -
    • -
  • - -
    -
    嗯~有个理念~开始写代码
    -
    -
    • -
-
+
+
+ +
+
- +
+
+ +
+ 
+				//开始使用
+				var tableSelect = layui.tableSelect;
+				tableSelect.render({
+					elem: '#demo',	//定义输入框input对象 必填
+					checkedKey: 'id' //表格的唯一建值，非常重要，影响到选中状态 必填
+					searchKey: 'keyword',	//搜索输入框的name值 默认keyword
+					searchPlaceholder: '关键词搜索',	//搜索输入框的提示文字 默认关键词搜索
+					table: {	//定义表格参数，与LAYUI的TABLE模块一致，只是无需再定义表格elem
+						url:'',
+				 		where:{},//默认table条件
+						response: {statusCode: 0},//返回数据格式参考table
+						cols: [[]]
+					},
+					done: function (elem, data) {
+					//选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据 []
+					//拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
+					}
+				})
+				//默认值
+				只需要在触发input上添加 ts-selected="1,2,3" 属性即可 值需与checkedKey对应
+
+
+
+
+ +
+
+ 更新时间线 +
+
    +
  • + +
    +
    10/18 Add 记住选中 / 赋默认选中值
    +
    +
    • +
  • + +
    +
    10/17 Add 多选分页选中
    +
    +
    • +
  • + +
    +
    10/08 Fix z-index / 边缘位置控制
    +
    +
    • +
  • + +
    +
    09/01 Add 搜索控制 / Add 双击选择
    +
    +
    • +
  • + +
    +
    08/31 完成初始版本
    +
    +
    • +
  • + +
    +
    嗯~有个理念~开始写代码
    +
    +
    • +
+
+
+
diff --git a/demo/tableSelect.js b/demo/tableSelect.js index bda5d51..b0be0dc 100644 --- a/demo/tableSelect.js +++ b/demo/tableSelect.js @@ -10,19 +10,19 @@ layui.define(['table', 'jquery', 'form'], function (exports) { }; /** - * 初始化表格选择器 - */ + * 初始化表格选择器 + */ tableSelect.prototype.render = function (opt) { var elem = $(opt.elem); var tableDone = opt.table.done || function(){}; - + //默认设置 opt.searchKey = opt.searchKey || 'keyword'; opt.searchPlaceholder = opt.searchPlaceholder || '关键词搜索'; opt.checkedKey = opt.checkedKey; opt.table.page = opt.table.page || true; opt.table.height = opt.table.height || 315; - + elem.off('click').on('click', function(e) { e.stopPropagation(); @@ -34,17 +34,17 @@ layui.define(['table', 'jquery', 'form'], function (exports) { var l = elem.offset().left +"px"; var tableName = "tableSelect_table_" + new Date().getTime(); var tableBox = '
'; - tableBox += '
'; - tableBox += '
'; - tableBox += ''; - tableBox += '
'; - tableBox += ''; - tableBox += '
'; - tableBox += '
'; - tableBox += '
'; - tableBox = $(tableBox); + tableBox += '
'; + tableBox += '
'; + tableBox += ''; + tableBox += '
'; + tableBox += ''; + tableBox += '
'; + tableBox += '
'; + tableBox += '
'; + tableBox = $(tableBox); $('body').append(tableBox); - + //数据缓存 var checkedData = []; @@ -65,7 +65,7 @@ layui.define(['table', 'jquery', 'form'], function (exports) { } updataButton(table.checkStatus(tableName).data.length) }) - table.on('checkbox('+tableName+')', function(obj){ + table.on('checkbox('+tableName+')', function(obj){ if(opt.checkedKey){ if(obj.checked){ for (var i=0;i $(window).height(); - var overWidth = (elem.offset().left + tableBox.outerWidth()) > $(window).width(); - overHeight && tableBox.css({'top':'auto','bottom':'0px'}); - overWidth && tableBox.css({'left':'auto','right':'5px'}) - + //FIX位置 + var overHeight = (elem.offset().top + elem.outerHeight() + tableBox.outerHeight() - $(window).scrollTop()) > $(window).height(); + var overWidth = (elem.offset().left + tableBox.outerWidth()) > $(window).width(); + overHeight && tableBox.css({'top':'auto','bottom':'0px'}); + overWidth && tableBox.css({'left':'auto','right':'5px'}) + //关键词搜索 form.on('submit(tableSelect_btn_search)', function(data){ + console.log(tableSelect_table.config.where); + console.log(data.field); var tablesearchwhere=tableSelect_table.config.where; layui.each(data.field,function(key,val){ tablesearchwhere[key]=val; @@ -190,9 +192,9 @@ layui.define(['table', 'jquery', 'form'], function (exports) { tableSelect_table.reload({ where: tablesearchwhere, page: { - curr: 1 + curr: 1 } - }); + }); return false; }); @@ -206,7 +208,7 @@ layui.define(['table', 'jquery', 'form'], function (exports) { tableBox.find('.tableSelect_btn_select').on('click', function() { var checkStatus = table.checkStatus(tableName); if(checkedData.length > 1){ - checkStatus.data = checkedData; + checkStatus.data = checkedData; } selectDone(checkStatus); }) @@ -225,7 +227,7 @@ layui.define(['table', 'jquery', 'form'], function (exports) { delete table.cache[tableName]; checkedData = []; } - + //点击其他区域关闭 $(document).mouseup(function(e){ var userSet_con = $(''+opt.elem+',.tableSelect'); @@ -239,8 +241,8 @@ layui.define(['table', 'jquery', 'form'], function (exports) { } /** - * 隐藏选择器 - */ + * 隐藏选择器 + */ tableSelect.prototype.hide = function (opt) { $('.tableSelect').remove(); } -- Gitee