layui表格排序后渲染失效

layui 表格在排序之后没有重新渲染问题

问题描述: 在layui表格中,最后一列增加了操作按钮,并且在某些行设置了样式,但是在排序之后,按钮的点击事件失效了,样式也没有了,可能是没有执行done回调原因: done回调只有在render和reload的时候执行解决办法: 在生成完表格之后,监听排序事件,在排序事件里面执行reload方法,重新执行done回调,并且初始化排序例子: html代码 <div id="tableTest" lay-filter="test"></div&

layui表格点击排序按钮后，表格绑定事件失效解决方法

最近项目使用layui较为频繁,遇到了一个麻烦的问题,网上搜索也没有看到同类型的问题,故此记下来. 需求是点击上图右侧表格中某一个单元格,会触发点击事件如下代码: $("table>tbody>tr>td").click(function(){ chickstr=$(this).attr("data-field"); if(typeof(chickstr)=='string'){ if(chickstr.indexOf("indiCode

改造 layui 表格组件实现多重排序

layui 的表格组件目前只支持单列排序,在实际应用中并不能很好的支撑我们的业务需求.今天一时手痒,决定改造一番以支持多重排序. 实现思路也比较简单,只需要用一个数组来存放所有排序的列,再把这个数组传到后端(后端排序)进行排序即可.沿用一般的使用习惯,按住 shift 键点击表头可增加排序列,按住 ctrl 键点击表头可减少排序列.话不多说,先上最终效果图: 1. 定义排序列数组我当前用的是 2.5.6 版本,源码之前为适应业务需求也做过相应修改,所以下文说到的行数只是个大概数. 为兼容之前单

案例学习总结：原生JS实现表格排序

最近在学习js的表格排序,没想到看不起眼的表格排序实际上却暗含了众多JS知识点.在这里记录一下此次学习过程.希望对大家也有所帮助. 完整的表格排序涉及了下列这些知识点: call方法使用 sort方法深入数据绑定 DOM映射下面详细的总结一下这些知识点,最后结合这些知识点实现下面这样一个表格排序案例. 完整的案例源码:https://github.com/daweihe/JSProjects 一.知识点总结 1.call方法使用 call方法的作用是改变方法中的this指向. call这个方

JS实现表格排序

今天有点闲,写个小东西,使用JS实现点击表格标题栏实现自动排序功能,嘻嘻... 一.JS代码,文件名为code.js如下: (function($){ //插件 $.extend($,{ //命名空间 sortTable:{ sort:function(tableId,Idx){ var table = document.getElementById(tableId); var tbody = table.tBodies[0]; var tr = tbody.rows; var trValue

JS表格排序

var employees = [] employees[0] = { name: "George", age: 32, retiredate: "March 12, 2014" } employees[1] = { name: "Edward", age: 17, retiredate: "June 2, 2023" } employees[2] = { name: "Christine", age: 5

javascript 表格排序和表头浮动效果(扩展SortTable)

前段时间一个项目有大量页面用到表格排序和表头浮动的效果,在网上找了几个表格排序的js代码,最后选择了 Stuart Langridge的SortTable,在SortTable基础上做了些扩展,加上了表头浮动效果及一些小功能. 一.SortTable说明 SortTable version 2 7th April 2007 Stuart Langridge, http://www.kryogenix.org/code/browser/sorttable/ Instructions: Downlo

JS对表格排序(支持对序号，数字，字母，日期)

JS对表格排序(支持对序号,数字,字母,日期) 前不久看到淘宝组件有"对表格排序的插件" 如想要看可以看这个地址 http://gallery.kissyui.com/KSortTable/1.0/demo/index.html 但是看了下他们的JS源码有点复杂所以自己试着写了一个简单点的,同样也能实现相应的功能,且相对于他们来讲多添加了一个"按日期排序的功能" , 目前对日期的格式支持两种格式:一种是2013/12/29 另外一种是:2013-12-29

js简单实现表格排序

昨天看到一篇关于表格排序的随笔,鉴于本人还只会简单的js,不会使用封装,所以自己也试了一下写这个效果.可能不太优化,原理思路是:获取行对象tr,排序tr中要比较的对象td,排序后添加回tbody.如下: 样式如下: <style>thead tr td{ cursor: pointer;}thead tr td:hover{ text-decoration: underline;}</style> 结构如下: <table><thead><

Layui表格编辑【不依赖Layui的动态table加载】

依赖jquer,layui/css <td class="My_edit"></td> Jquery代码 //-----[Layui表格编辑(<td class="My_edit"></td>)] 2018-11-13 function Layui_edit(){ //数据可编辑 $(".My_edit").toggle(function(){ var text=$(this).html(); $(

前端页面表格排序 jQuery Table 基础

通常来说, 排序的方式有两种, 一种是我们在查询的时候就排好序,然后将数据渲染到前台页面上, 但是这样做有个弊端,就是在争对做好了缓存处理的系统, 在查询相同数据的时候进行排序,可能不能成功, 因为进行排序的数据和之前的数据是相同的, 第二次排序数据是直接从缓存中取,所以数据库进行排序就不能满足这个需求. 另一种方法就是前端进行排序,利用DOM和jQuery 将当前页面中所有的数据进行排序, 这样做的好处是可以避免大量的后台交互, 每一次与后台的交互都会浪费很多的资源, 尤其是在并发量比较大的系

layui表格参数

layui表格对数据进行用table样式展现举个例子: <!doctype html> <html> <head> <meta charset="utf-8"> <title>layui表格div容器</title> </head> <body> <div id="container"></div> </body> </html

【转】Expire Google Drive Files 让Google Docs云盘共享连接在指定时间后自动失效

最近在清理Google Docs中之前共享过的文件链接,发现Google Docs多人协作共享过的链接会一直存在,在实际操作中较不灵活.正好订阅的RSS推送了Pseric写的这篇文章 - Expire Google Drive Files 让Google 云端硬碟共用连结在指定时间后自动失效,文中介绍的Expire Google Drive Files可以让Google Docs云盘共享连接在指定时间后自动失效解决了指定时间内权限失效的问题. —————————————————————————

将1~n个整数按字典顺序进行排序，返回排序后第m个元素

给定一个整数n,给定一个整数m,将1~n个整数按字典顺序进行排序,返回排序后第m个元素.n最大可为5000000.字典排序的含义为:从最高位开始比较.1开头的数字排在最前面,然后是2开头的数字,然后是3开头的数字……最高位相同的数字,按同样的逻辑比较次高位……以此类推.例:给定整数为n=13,m=5,那么字典排序结果为: [1,10,11,12,13,2,3,4,5,6,7,8,9] ,程序最终输出为13. 输入:m, n 输出:第m个数 #include<iostream> #include

IO流的练习5 —— 读取文件中的字符串，排序后写入另一文件中

需求:已知s.txt文件中有这样的一个字符串:“hcexfgijkamdnoqrzstuvwybpl” 请编写程序读取数据内容,把数据排序后写入ss.txt中. 分析: A:读取文件中的数据 B:把数据存在一个字符串中 C:把字符串转换成字符串数组 D:对字符串数组进行排序 E:数组转换成字符串 F:把字符串写入文件中 public static void main(String[] args) throws IOException { // 读取文件中的数据字符缓冲输入流 BufferedR

jQuery 表格排序插件 Tablesorter 使用

jQuery 表格排序插件 Tablesorter 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面): <script src="lib/jquery-1.8.3.min.js"></script>  <link href="css/css_tablesorter_green/style.css" rel="stylesheet" type="

[原]Java面试题-将字符串中数字提取出来排序后输出

[Title][原]Java面试题-将字符串中数字提取出来排序后输出 [Date]2013-09-15 [Abstract]很简单的面试题,要求现场在纸上写出来. [Keywords]面试.Java.排序 [Environment]Windows 7 . JDK6 [Author]wintys (wintys@gmail.com) http://wintys.cnblogs.com [URL]http://www.cnblogs.com/wintys/p/jobinterview_extract

Java基础知识强化之IO流笔记52：IO流练习之把一个文件中的字符串排序后再写入另一个文件案例

1. 把一个文件中的字符串排序后再写入另一个文件已知s.txt文件中有这样的一个字符串:"hcexfgijkamdnoqrzstuvwybpl" 请编写程序读取数据内容,把数据排序后写入ss.txt中. 分析: A: 把s.txt这个文件给做出来 B: 读取该文件的内容,存储到一个字符串中 C: 把字符串转换为字符数组 D: 对字符数组进行排序 E: 把排序后的字符数组转换为字符串 F: 把字符串再次写入ss.txt中 2. 代码实现: package cn.itcast

Javascript 数组自定义排序，并获取排序后的保存原索引的同序数组(堆排序实现)

比如数组A: [ 0: 5, 1: 2, 2: 4, 3: 3, 4: 1 ] 排序后的结果为:[1, 2, 3, 4, 5],但是有时候会有需求想要保留排序前的位置到一个同位数组里,如前例则为:[4, 1, 3, 2, 0],因此就利用堆排序写了一个单独的数组排序过程加以实现. 代码如下: function arrayKeys(arr) { var i = 0, len = arr.length, keys = []; while (i < len) { keys.push(i++); } r

Xcode升后插件失效

Xcode升后插件失效,与添加插件不小心点击Skip Bundle解决办法字数267 阅读4731 评论1 喜欢12 今天升级了xcode到6.4 发现之前装的插件不能使用了.这里有一个解决的方案: 步骤如下: 一.查看Xcode的UUID 在终端执行 defaults read /Applications/Xcode.app/Contents/Info DVTPlugInCompatibilityUUID 复制UUID后面那一串字符串然后打开xcode插件所在的目录:~/Library/A

巴特西