Question

我的数据表显示得很好，但是我希望它们能够响应移动查看。

我尝试添加responsive:true选项，但没有任何改变。

jQuery ->
  $("#eventmanagment").dataTable({
    "searching": true
    "responsive": true
    "lengthMenu": [[5, 10, 25, 50, 100, 250, -1], [5, 10, 25, 50, 100, 250, "All"]]
  })
  $("#eventmanagmentone").dataTable({
    "searching": true
    "limit": 5
    "lengthMenu": [[5, 10, 25, 50, 100, 250, -1], [5, 10, 25, 50, 100, 250, "All"]]

  })

当用户缩小窗口或使用移动设备时，桌子应该向下折叠。

Answer 1

您需要添加javascript和css文件以启用数据表中的响应功能工作

这是获取这些文件的link

添加CSS和javascript文件后，您需要启用响应功能。

"responsive": true

工作示例为here

响应数据表扩展库

css
//cdn.datatables.net/responsive/2.2.2/css/responsive.bootstrap.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.dataTables.min.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.jqueryui.min.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.bootstrap4.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.dataTables.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.semanticui.min.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.bootstrap4.min.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.jqueryui.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.foundation.min.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.bootstrap.min.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.foundation.css
//cdn.datatables.net/responsive/2.2.2/css/responsive.semanticui.css
js
//cdn.datatables.net/responsive/2.2.2/js/responsive.semanticui.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.jqueryui.min.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.bootstrap4.min.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.bootstrap4.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.dataTables.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.foundation.min.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.bootstrap.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.semanticui.min.js
//cdn.datatables.net/responsive/2.2.2/js/dataTables.responsive.min.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.foundation.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.bootstrap.min.js
//cdn.datatables.net/responsive/2.2.2/js/dataTables.responsive.js
//cdn.datatables.net/responsive/2.2.2/js/responsive.jqueryui.js

如何在.coffee文件中使数据表响应（Rails）

1 个答案: