美文网首页Django
2018-10-12 dataTable 自动响应

2018-10-12 dataTable 自动响应

作者: 多吃水果少吃肉 | 来源:发表于2018-10-12 16:22 被阅读0次

之前做 DataTable 的时候发现 不会自适应响应,这是个很大的问题,官方文档示例如链接 https://datatables.net/extensions/responsive/examples/display-control/auto.html , 观察我代码和他的区别发现它包含了一个 responsive.dataTables.min.css 添加到页面之后发现还是不会响应,再比较发现还有一个 style="width:100%":

包含这个 css:
https://cdn.datatables.net/responsive/1.0.7/css/responsive.dataTables.min.css
在 table 添加 style="width:100%" 即可响应
<table id="data-table" style="width:100%">

然后在 aoColumns -- sWidth 指定宽度

        "aoColumns": [
            {
                // 可以指定宽度
                sWidth: '4%',
                "data": "pk",
                render: function (pk) { 略  }
            }
          }

再通过添加 "sClass": "hidden-xs" 参数指定隐藏的列条件.

后来在测试发现,不包含 responsive.dataTables.min.css 文件也可以响应,可能是我说我页面已经包含了 bootstrap的原因吧,果断去掉了,节省资源

相关文章

网友评论

    本文标题:2018-10-12 dataTable 自动响应

    本文链接:https://www.haomeiwen.com/subject/omegaftx.html