datatable - Bootstrap 4选项卡中的数据表响应
问题描述
我正在开发一个带有响应式数据表的 jsf 应用程序。它在真实手机中无法正常工作。当我触摸并向上/向下滚动表格时,它会正确显示。
以下是响应式代码:
<h:column a:data-priority="1">
<f:facet name="header">ID</f:facet>
#{_row.id}
</h:column>
<h:column a:data-priority="2">
<f:facet name="header">Số CMND</f:facet>
#{_row.code}
</h:column>
<h:column a:data-priority="2">
<f:facet name="header">Tên</f:facet>
#{_row.name}
</h:column>
<h:column a:data-priority="0">
<f:facet name="header">
<h:commandLink action="#{employeeEditBean.addDependent()}" value="Add" >
<f:ajax render="form#{tabname}" onevent="onEventAdd#{tabname}" />
</h:commandLink>
</f:facet>
<h:commandLink action="#{employeeEditBean.editEmployeeDependent(_row.id)}"
value="Edit" title="Hiệu chỉnh dòng"
>
<f:ajax render="form#{tabname}" onevent="onEventEdit#{tabname}" />
</h:commandLink>
<h:outputText value=" " escape="true" />
<h:commandLink action="#{employeeEditBean.editEmployeeDependent(_row.id)}"
styleClass="fa fa-trash" title="Xóa dòng" style="color: #e0a800 !important"
>
<f:ajax render="form#{tabname}Delete" onevent="onEventDelete#{tabname}" />
</h:commandLink>
</h:column>
Java脚本:
$('#tablexx').DataTable({
rowReorder: {
selector: 'td:nth-child(2)'
}, responsive: true
});
结果如下:
我还将应用程序放到我的测试服务器上:
用户:亚当/通行证:亚当1
请帮我。
非常感谢 - VinhCC
解决方案
推荐阅读
- javascript - 切换可见性时添加到表中的第一项丢失
- python - 为什么选择 Matplotlib 3.0?
- angular - Angular 6 和 Firestore:循环和更新 AFS 集合中每个文档的最佳方式?
- javascript - 如何从两个数组中获取总长度?
- c# - 检查控制台输出的每个值
- html - 隐藏侧边栏动画后如何执行代码?
- lambda - Java8 Lambda 和流:
而不是必需的 - php - 在 Eloquent ORM 中设置 PDO::ERRMODE_SILENT
- html - Favicon 未出现在浏览器选项卡中
- vba - VBA 将工作表复制到另一个打开的工作簿