在打印媒体视图中定位表格

时间:2016-04-14 16:02:11

标签: javascript html css html5 css3

创建的打印介质视图中的表格不是预期的首选格式。

查看应如何打印页面。表格显示在第二页而不是第一页。我假设它在分页符中存在问题。我从网上尝试了很多解决方案,但似乎都没有。

这是我的媒体打印代码:

@media print {
   table td:last-child {display:none}
   table th:last-child {display:none}
   table td:last-child {display:none}
   table th:6th-child {display:none}
}

截至目前,我仍然不知道解决方案。

以下是一些让事情更清晰的图片

此表似乎位于第二页: table

应该在这里显示的第一页打印出来: first page

我需要一个解决方案来将表格从第二页移到第一页。

这里添加的是表格的html代码:

          <table data-toggle="table" id="table-style" data-row-style="rowStyle">
                                            <thead>
                                                <tr>
                                                    <th data-field="date"  data-sortable="true">Date</th>
                                                    <th data-field="id" data-sortable="true">Order No.</th>
                                                    <th data-field="agent"  data-sortable="true">Agent</th>
                                                    <th data-field="name"  data-sortable="true">Customer</th>
                                                    <th data-field="status"  data-sortable="true">Status</th>
                                                    <th id = "view">View</th>
                                                    <th id = "send">Send</th>
                                                    <th id = "send">Cancel</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                            @foreach($newOrdersQ as $order)
                                                    <tr>
                                                        <td><?= $order->date;?></td>
                                                        <td><?= $order->orderID;?></td>
                                                        <td><?= $order->agent;?></td>
                                                        <td><?= $order->customerCompany;?></td>
                                                        <td><?= $order->status;?></td>
                                                        <td>
                                                            <form id='viewButton' action='/specificView'>
                                                                <input class="btn btn-default" type="hidden" id='viewData' name="viewData" value='<?= $order->orderID;?>'>
                                                                <input class="btn btn-default" id='viewBtn' name="submit" type="submit" value="View">
                                                            </form>
                                                        </td>
                                                        <td>
                                                            <form id='toTBDid<?= $order->orderID;?>'>
                                                                <input type="hidden" id='sendData' name="sendData" value='<?= $order->orderID;?>'>
                                                                <input class="btn btn-default" id='viewBtn' name="submit_" type="button" value="Send" onclick='toTBDS(<?= $order->orderID;?>)'>
                                                            </form>
                                                        </td>
                                                        <td>
                                                            <form id='cancelOrderNO<?= $order->orderID;?>'>
                                                                <input type="hidden" id='sendData' name="sendData" value='<?= $order->orderID;?>'>
                                                                <input class="btn btn-default" id='viewBtn' name="submit_" type="button" value="Cancel" onclick='toTBDC(<?= $order->orderID;?>)'>
                                                            </form>
                                                         </td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>

0 个答案:

没有答案