界面样式:
HTML:
<script type="text/html" id="timeSearch">
<input class="time" type="checkbox" id="{{d.col}}_time" lay-filter="timeSearch" value="{{d.col}}" lay-skin="switch" lay-text="开启|关闭" {{d.timeSearch=='true'?'checked':''}} />
</script>
<script type="text/html" id="ordinarySearch">
<input class="ordinary" type="checkbox" id="{{d.col}}_ordinary" lay-filter="ordinarySearch" value="{{d.col}}" lay-skin="switch" lay-text="开启|关闭" {{d.ordinarySearch=='true'?'checked':''}} />
</script>
js实现:
//************************************************************//
框选的部分为重点!!!
//监听时间搜索框操作
form.on('switch(timeSearch)', function (obj) {
//************************************************************//
// 获取当前控件
var selectIfKey = obj.othis;
// 获取当前所在行
var parentTr = selectIfKey.parents("tr");
//************************************************************//
// 获取当前所在行的索引
var col = this.value;
// console.log(this.value + ' ' + this.name + ':'+ obj.elem, obj.othis);
// layer.tips('查询框:'+ obj.elem.checked, obj.othis);
var oldData = table.cache[searchTable.tableId];
$.each(oldData, function (i, n) {
if (col === n.col) {
if (obj.elem.checked) {
//判断普通搜索框是否为选中状态,如果是则改为否
if (n.ordinarySearch) {
// $("#"+n.col+"_ordinary").removeAttr('checked');
//************************************************************//
var switchIfNull = $($($(parentTr).find("td")[2]).find("input")[0]);
$(switchIfNull).removeAttr('checked');
//************************************************************//
n.ordinarySearch = false;
form.render();
}
n.timeSearch = true;
} else {
n.timeSearch = false;
}
}
});
});
//监听普通搜索框操作
form.on('switch(ordinarySearch)', function (obj) {
var col = this.value;
// 获取当前控件
var selectIfKey = obj.othis;
// 获取当前所在行
var parentTr = selectIfKey.parents("tr");
var oldData = table.cache[searchTable.tableId];
$.each(oldData, function (i, n) {
if (col === n.col) {
if (obj.elem.checked) {
//判断时间搜索框是否为选中状态,如果是则改为否
if (n.timeSearch) {
var switchIfNull = $($($(parentTr).find("td")[1]).find("input")[0]);
$(switchIfNull).removeAttr('checked');
n.timeSearch = false;
form.render();
}
n.ordinarySearch = true;
} else {
n.ordinarySearch = false;
}
}
});
});