推广 热搜: page  关键词  红书  哪些  数据分析  链接  搜索  获取  小红  服务 

datatables 实现表格汉化,第一列添加复选框checkbox及相关操作实现

   日期:2024-12-31     作者:tx2jh    caijiyuan   评论:0    移动:https://sicmodule.kub2b.com/mobile/news/13943.html
核心提示:背景:项目需要做后台管理前端界面。数据展示用到datatables 问题:需求是表格展示第一列添加checkbox复选框,

背景:项目需要做后台管理前端界面。数据展示用到datatables

问题:需求是表格展示第一列添加checkbox复选框,因为datatables生成的table是没有复选框的。而且要实现批量选择,单击行选择等操作。

参考资源

datatables中文,datatables英文,https://chinacheng.iteye.com/blog/2105036,https://stackoverflow.com/questions/39285643/datatable-jquery-how-to-remove-sort-icon-from-first-column,https://www.bbsmax.com/A/gGdXE2Ez4m/,http://www.voidcn.com/article/p-mtakzsvo-xv.html

问题解决

本人非前端有错误还需指正。建议英文好的还是看原版英文api,感觉很多在中文版的里面并没有介绍。

1. 如何把创建的表格汉化并在表格中添加复选框(checkbox)呢

datatables默认创建出来的各项功能描述都是英文的。如何去汉化呢?只需要在前端js代码创建datatable对象的时候,指定language属性。

如何去添加checkbox呢?由于后台用的django模版,这一步还是比较好去实现的。在前端定义table,并分别定义thead,tbody和tfoot。在thead中定义表头内容。tbody是通过django模版包含命令将每一行数据信息包含到表格中。tfoot与thead类似。

这是是父template。

:其中父template中复选框之前定义一个label是为了点击文字也可以做到复选框被选中。

子template中

    以上就完成了在创建的表格中添加checkbox。

2.既然已经表格中添加了复选框,如何做到点击表头复选框批量选中子复选框呢?还有如何点击表行复选框也选中呢

以下是我看到的最nice的实现方法。

只需要在创建datatable对象的时候。加入

是不是很nice。

点击表行复选框选中只需要在创建datatable对象的时候。加入

3.第一列添加了复选框,我们如何去除它的自动排序功能

我实验了网上挺多方法都没起作用。最后起作用的是。在创建datatable对象的时候。指定

之所以要指定order是因为datatables生成table会有默认值。

后来看英文api发现aoColumnDefs都过时了。可以写成

本文地址:https://sicmodule.kub2b.com/news/13943.html     企库往 https://sicmodule.kub2b.com/ , 查看更多

特别提示:本信息由相关用户自行提供,真实性未证实,仅供参考。请谨慎采用,风险自负。

 
 
更多>同类最新资讯
0相关评论

文章列表
相关文章
最新动态
推荐图文
最新资讯
点击排行
网站首页  |  关于我们  |  联系方式  |  使用协议  |  版权隐私  |  网站地图  |  排名推广  |  广告服务  |  积分换礼  |  网站留言  |  RSS订阅  |  违规举报  |  鄂ICP备2020018471号