数据表:导出 Excel 按钮

发布于 2024-12-09 01:04:59 字数 217 浏览 0 评论 0原文

有没有办法设置“导出”、“PDF”按钮的位置? (在表格的右侧,表格的右下角,...)

http ://www.datatables.net/release-datatables/extras/TableTools/

Is there a way to set the position of the Export, PDF button ? (on the rightr of the table, bottom right of the table, ....)

http://www.datatables.net/release-datatables/extras/TableTools/

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

绝對不後悔。 2024-12-16 01:04:59

如果要移动整个表格工具栏,请在初始化时移动 T 字母。最后推动整个工具栏的示例是:

$('#example').dataTable( {
    "sDom": '<"clear">lfrtipT'
} );

您无法重新配置 DataTables 以仅移动 pdf 按钮,但您可以使用标准 JQuery 将类为“DTTT_button_pdf”的按钮移动到某个新位置。可能是这样的:

var pdfButton = $(".DTTT_button_pdf").detach();
$("#newPosition").append( pdfButton );

在这个例子中,newPosition 是您放置 pdf 按钮的元素的 id。

If you want to move entire table tools toolbar move T letter in the initialization. Example that pushes entire toolbar at the end is:

$('#example').dataTable( {
    "sDom": '<"clear">lfrtipT'
} );

You cannot reconfigure DataTables to move only pdf button, but you can use standard JQuery to take button with class "DTTT_button_pdf" to some new position. Probably something like:

var pdfButton = $(".DTTT_button_pdf").detach();
$("#newPosition").append( pdfButton );

In this example, newPosition is an id of the element where you an to place pdf button.

囚我心虐我身 2024-12-16 01:04:59
            var oTable = $("#tblViewMetadata").dataTable({
                "oLanguage": { "sSearch": "Search All Columns:" },
                "bJQueryUI": true,
                "bDestroy": true,
                "bPaginate": true,
                "bLengthChange": true ,
                "bFilter": true,
                "bSort": true,
                "bInfo": true,
                "bAutoWidth": true,
                "bDeferRender": true,
                "bRetrieve": true,
                "sScrollX": "500px",
                "sPaginationType": "full_numbers",
                "sDom": '<"H"lTfr>t<"F"ip>',

                "aLengthMenu": [[ 10, 25, 50,100, -1], [10, 25, 50,100, "All"]],
                "iDisplayLength": 10,
              ,
                "bSearchable": true,

                "oTableTools": {
                            "sSwfPath": "../Content/swf/copy_csv_xls.swf",
                            "aButtons": [
                             {
                                 "sExtends": "xls",
                                 "mColumns": [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
                                 "sPdfOrientation": "landscape",
                                 "sButtonText": "Export to Excel",
                                 "oSelectorOpts": { filter: 'applied', order: 'current',page:'current' },
                             }
                            ]
                }, "bProcessing": true,
                "bDestroy": true,
                "aoColumnDefs": [{
                    'bSortable': false,
                    'aTargets': [0, 1]
                }], 







            });









<link href="~/Content/themes/base/demo_page.css" rel="stylesheet" />
<link href="~/Content/themes/base/demo_table_jui.css" rel="stylesheet" />

<link href="~/Content/themes/base/TableTools.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />

<script src="~/Scripts/js/jquery-1.8.2.js"></script>
<script src="~/Scripts/js/jquery.ui.core.js"></script>
<script src="~/Scripts/js/jquery.ui.widget.js"></script>
<script src="~/Scripts/js/jquery.ui.datepicker.js"></script>
<script src="~/Scripts/js/jquery.dataTables.js"></script>
<script src="~/Scripts/js/jquery.ui.dialog.js"></script>
<script src="~/Scripts/js/dataTables.tableTools.min.js"></script>
<script src="~/Scripts/js/ZeroClipboard.js"></script>
<script src="~/Scripts/js/TableTools.js"></script>


var allButton = $(" div.DTTT_container ").detach();
    $("#ExportBtn").append(allButton);
            var oTable = $("#tblViewMetadata").dataTable({
                "oLanguage": { "sSearch": "Search All Columns:" },
                "bJQueryUI": true,
                "bDestroy": true,
                "bPaginate": true,
                "bLengthChange": true ,
                "bFilter": true,
                "bSort": true,
                "bInfo": true,
                "bAutoWidth": true,
                "bDeferRender": true,
                "bRetrieve": true,
                "sScrollX": "500px",
                "sPaginationType": "full_numbers",
                "sDom": '<"H"lTfr>t<"F"ip>',

                "aLengthMenu": [[ 10, 25, 50,100, -1], [10, 25, 50,100, "All"]],
                "iDisplayLength": 10,
              ,
                "bSearchable": true,

                "oTableTools": {
                            "sSwfPath": "../Content/swf/copy_csv_xls.swf",
                            "aButtons": [
                             {
                                 "sExtends": "xls",
                                 "mColumns": [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
                                 "sPdfOrientation": "landscape",
                                 "sButtonText": "Export to Excel",
                                 "oSelectorOpts": { filter: 'applied', order: 'current',page:'current' },
                             }
                            ]
                }, "bProcessing": true,
                "bDestroy": true,
                "aoColumnDefs": [{
                    'bSortable': false,
                    'aTargets': [0, 1]
                }], 







            });









<link href="~/Content/themes/base/demo_page.css" rel="stylesheet" />
<link href="~/Content/themes/base/demo_table_jui.css" rel="stylesheet" />

<link href="~/Content/themes/base/TableTools.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />

<script src="~/Scripts/js/jquery-1.8.2.js"></script>
<script src="~/Scripts/js/jquery.ui.core.js"></script>
<script src="~/Scripts/js/jquery.ui.widget.js"></script>
<script src="~/Scripts/js/jquery.ui.datepicker.js"></script>
<script src="~/Scripts/js/jquery.dataTables.js"></script>
<script src="~/Scripts/js/jquery.ui.dialog.js"></script>
<script src="~/Scripts/js/dataTables.tableTools.min.js"></script>
<script src="~/Scripts/js/ZeroClipboard.js"></script>
<script src="~/Scripts/js/TableTools.js"></script>


var allButton = $(" div.DTTT_container ").detach();
    $("#ExportBtn").append(allButton);
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文