数据表编辑器按钮不显示在长模态

Question

我在 PHP/mySQL 网站中使用数据表编辑器。

当打开一个较长的模态窗体（带有滚动条）时，本应显示在模态窗体右下角的更新按钮在第一次单击时不会显示。

第一次点击时，没有滚动条的较短模式会显示更新按钮。

如果我通过单击表单右上角的 'x' 关闭长模态框并重新打开编辑器，更新最终会显示。

我有一张图片显示编辑模式下没有显示更新按钮。不确定我还能提供哪些其他信息来帮助您。

我的站点有很多使用 Bootstrap.

的脚本

这是我加载 .js 文件的方式。

 <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.2.4.js"></script>

 <script src="assets/global/plugins/jquery-migrate.min.js" type="text/javascript"></script>

 <script src="assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
 <script src="assets/global/plugins/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
 <script src="assets/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" type="text/javascript"></script>
 <script src="assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
 <script src="assets/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>

 <script src="https://cdn.datatables.net/buttons/1.2.1/js/dataTables.buttons.min.js" type="text/javascript"></script>
 <script src="https://cdn.datatables.net/select/1.2.0/js/dataTables.select.min.js" type="text/javascript"></script>

.. 和我的 css 文件的顺序是：

 <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css"/>
 <link href="assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
 <link href="assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css"/>
 <link href="assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
 <link href="assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css"/>
 <link rel="stylesheet" type="text/css" href="assets/global/plugins/bootstrap-toastr/toastr.min.css">
 <link rel="stylesheet" type="text/css" href="assets/global/plugins/bootstrap-summernote/summernote.css">
 <link href="assets/global/plugins/datatables/datatables.min.css" rel="stylesheet" type="text/css" />
 <link href="assets/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css" rel="stylesheet" type="text/css" />
 <link href="https://cdn.datatables.net/buttons/1.2.1/css/buttons.dataTables.min.css" rel="stylesheet" type="text/css" />
 <link href="https://cdn.datatables.net/select/1.2.0/css/select.dataTables.min.css" rel="stylesheet" type="text/css" />
 <link rel="stylesheet" type="text/css" href="added-assets/plugins/editor/css/editor.dataTables.css">

Answer 1

这是 Chrome 的问题，请参阅此处的讨论， http://www.edoitor.datatables.net/forums/discussion/38145

解决方法是在页面加载后更改 css，

editor.on('open', function () {
            $('div.DTE_Footer').css( 'text-indent', -1 );
        });

数据表编辑器按钮不显示在长模态

Datatables Editor Buttons Not Showing On Long Modal

jquery

datatables

jquery-datatables-editor