html table行拖拽后排序
前端表格进行拖动排序,1.普通表格普通表格,采用引入 jquery.tablednd.js 的方式进行拖拽排序使用案例1). 在html页面table元素上增加class=“tablednd”2). 在js中引用方法进行初始化onDrop方法是拖拽后的回调函数,可按照需要与后台进行一些数据交互。注意:拖动表格需要给<tr> 加上id属性,不然回调函数不生效取消拖拽效果$("#workl
·
前端表格进行拖动排序,
1.普通表格
普通表格,采用引入 jquery.tablednd.js 的方式进行拖拽排序
使用案例
1). 在html页面table元素上增加class=“tablednd”
2). 在js中引用方法进行初始化
onDrop方法是拖拽后的回调函数,可按照需要与后台进行一些数据交互。
注意:拖动表格需要给<tr> 加上id属性,不然回调函数不生效
取消拖拽效果
$("#worklistTable tr").addClass("nodrop nodrag");
2.bootstrap table
引入js 及css
bootstrap-table.js bootstrap-table.css jquery.tablednd.js bootstrap-table-reorder-rows.js
使用案例
1)在bootstraptable初始化是增加属性 redoerableRow 和useRowAttrFunc 属性
2)调用回调函数,在回调函数中进行与后台的交互
更多推荐
已为社区贡献1条内容
所有评论(0)