Question

使用otabletools下载无法正常工作。如果我删除了style="display:none"，那么我就可以下载了。但我的要求是当我点击显示按钮然后我想显示表并下载。请帮帮我。

以下是我的代码

<link href="<%=request.getContextPath()%>/media/css/TableTools.css" rel="stylesheet" type="text/css">
<script type="text/javascript" language="javascript" src="<%=request.getContextPath()%>/media/js/jquery-1.8.1.js"></script>
<script src="<%=request.getContextPath()%>/media/js/jquery.dataTables.js"></script>
<script src="<%=request.getContextPath()%>/media/js/ZeroClipboard.js"></script>
<script src="<%=request.getContextPath()%>/media/js/TableTools.js"></script>     
</head>

<body id="dt_example">
    <div id="container">      
        <div style="display: none" id="otableDiv" class="otableDiv">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="example" >
                <thead>
                    <tr>
                        <th>Rendering engine</th>
                        <th>Browser</th>
                        <th>Platform(s)</th>
                        <th>Engine version</th>
                        <th>CSS grade</th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="odd gradeX">
                        <td>Trident</td>
                        <td>Internet Explorer 4.0</td>
                        <td>Win 95+</td>
                        <td class="center"> 4</td>
                        <td class="center">X</td>
                    </tr>
                    <tr class="even gradeC">
                        <td>Trident</td>
                        <td>Internet Explorer 5.0</td>
                        <td>Win 95+</td>
                        <td class="center">5</td>
                        <td class="center">C</td>
                    </tr>          
                <tfoot>
                    <tr>
                        <th>Rendering engine</th>
                        <th>Browser</th>
                        <th>Platform(s)</th>
                        <th>Engine version</th>
                        <th>CSS grade</th>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>
    <input type="button" id="btn" value="show">
</body>

<script type="text/javascript">
    $(document).ready(function() {

        $('#example').dataTable({
            "sDom": 'T<"clear">lfrtip',
            "oTableTools": {
                "aButtons": [
                    {
                        "sExtends": "pdf",
                        "sButtonText": "Download Pdf",
                        "sButtonClass": "btn-primary"
                    }
                ]
            }
        });


        $("#btn").click(function() {
            $(".otableDiv").css({'display': 'table'});
        });
    });

</script>

当style =“display：none”时，下载不在otabletools中工作

0 个答案: