tnblog
首页
视频
资源
登录

点击input弹出table数据表格

8728人阅读 2019/3/19 17:37 总访问:299917 评论:1 收藏:0 手机
分类: .NET

                 

  1. 先看下效果图

   

    插件下载地址  https://gitee.com/lolicode/layui_component_tableselect

       因为是以layer基础开发所以要引用layer 相关js

    

    实例化表格


    参数:elem:绑定input的ID,searchKey:搜索的关键字,checkedKey:选中字段(如果前台没有会影响选中一般为ID),data:为获取到的一行数据

                数据格式为数组:

后端接收相关参数进行(EF)分页page:第几页,limit:每页显示条数:

做完这一步你会发现我们样式跟展示不一样(不知道是不是大家都这样):

        然后找遍layer相关文档发现可以设置表头 style :margin-top但是没用,然后只能自己想办法写样式了,于是在浏览器进入开发者模式

        这样设置好了后,发现可行,$("tbody .layui-icon").attr("style", "margin-top: 15px");实例化添加样式,发现没鸟用!

    经过研究发现,表格是在点击input弹出于是只要添加点击事件就可以了,但是这样有个弊端,因为表格是一开始实例化这样添加样式没什么用,想到js延时执行方法setTimeout和setInterval,

     setTimeout当点击查询时样式会变回去,所以采用setInterval,


        然后大功告成啦!

评价

剑轩

2019/3/19 17:59:45

点赞!~

bootstrap动态生成的单选框复选框等无法点击选中的问题

bootstrap的单选框、复选框是要经过渲染的,然后才显示出来的经过渲染的是这样的没有经过渲染的就是最原始的样子所以它的选...

MUI 点击上拉加载

首先在想获取加载下一页数据时的div外设置一个想要加载的div如:<divclass="mui-content-padded"style="...

mui 关于点击事件失效的一些原因

有时候我们总会遗忘一些小细节,老是怨天怨电脑,这不行那不行的,凡是都是要细心,成功还是得看细节。所以说,以后我们敲...

vue.js获取点击元素本身,获取jquery对象

dom节点:<av-for="depindepArray"class="option-list"v-on:click="filterUser($event,dep.de...

点击列表改变列表里复选框的状态

使用ionic的小伙伴,如果遇到点击列表,让列表里的复选框动态改变,点一下取消再点一下勾上,单独的列表 每个不一样列表的...

layui Tab菜单添加点击事件

layui 实现Tab菜单很简单使用下面的代码即可<divclass="layui-tab"lay-filter="test1"> <ul...

layui表单中按钮加点击事件

其实可以和用jquery绑定事件一样layui.$('#savebutton').on('click',function(){ });

layui给table中的单选按钮添加点击事件

比如这样的一个表格其实用form.on就行了,里边接你需要监听事件的类型比如单选就是radio后面的premissonradio就是lay-filte...

jstree添加点击事件

code show:$('#树形id').bind("activate_node.jstree",function(obj,e){ //获取当前节点 varcurrentNo...

jstree的点击事件,改变事件等

直接贴代码: //加载完成后触发的事件 $('#tree_3').on("ready.jstree", function (e, data) ...

layer表格点击事件获取当前top以left

直接上代码吧 var t = obj.tr.find("td[lay-event='Title']").offset().top + obj.tr.find("td[lay...

设置div点击域隐藏div

直接上代码//监听全部全部鼠标事件$(document).mouseup(function (e) { var con = $("div"); // 设...

layer表格点击事件悬浮div(更新修改一下错误)

效果图首先说说需求,点击表格某一列显示详情layertable有个监听事件event有两种方式触发,第一种是按钮也就是操作一栏,这...

关于点击时悬浮当前位置div部分显示不全问题

//点击触发悬浮div可以看看这篇 :https://www.tnblog.net/15736469932/article/details/5137 t为当前table点击事件的top ...
若人生只如初见,愿还是相遇的那个下午,阳光明媚转身一笑便如春暖花开
排名
16
文章
53
粉丝
7
评论
13
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术