如何打印gridview的带滚动？ [英] How to print gridview with scrolling?

问题描述

我在做它采用滚动作为列的GridView比我的网页的页面宽度更。
问题是，当我想打印只打印显示的数据。我怎么能在一个div或者面板打印一切？

I am making a gridview which uses scrolling as the column are a more than the page width of my webpage . The issue is when i want to print it only prints the shown data. How can i print everything in a div or panel ?

我的code对于GRIDVIEW：

MY CODE FOR GRIDVIEW:

<a href="#" onclick="printPartOfPage('content-middle')" >PRINT ME </a>

<asp:Panel ID="gridPanel" runat="server" Height="500px" Width="980px" ScrollBars="Auto">


   <asp:GridView EnableSortingAndPagingCallbacks="true" Width="450px" 
            OnRowCreated="GridView1_RowCreated" runat="server" ID="GridView2" 
          CellPadding="4" ForeColor="#333333" GridLines="None" 
            >

                 <AlternatingRowStyle BackColor="White" ForeColor="#284775" />

                 <Columns>

                     <asp:HyperLinkField DataNavigateUrlFields="ID" 
                         DataNavigateUrlFormatString="updateAppointmentOperations.aspx?showID={0}" Text="Update " 
                         Target="_blank" />
                 </Columns>

                 <EditRowStyle BackColor="#999999" />
                 <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                 <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                 <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                 <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                 <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                 <SortedAscendingCellStyle BackColor="#E9E7E2" />
                 <SortedAscendingHeaderStyle BackColor="#506C8C" />
                 <SortedDescendingCellStyle BackColor="#FFFDF8" />
                 <SortedDescendingHeaderStyle BackColor="#6F8DAE" />

             </asp:GridView>

    </asp:Panel>

和JavaScript打印我得到了互联网，它是：

And the javascript print i got of the internet and it is:

<script type="text/javascript">

function printPartOfPage(elementId) {
    var printContent = document.getElementById(elementId);
    var windowUrl = 'about:blank';
    var uniqueName = new Date();
    var windowName = 'Print' + uniqueName.getTime();
    var printWindow = window.open(windowUrl, windowName, 'left=50000,top=50000,width=0,height=0');

    printWindow.document.write('<link rel="stylesheet" type="text/css" href="style/additional.css" /><link rel="stylesheet" type="text/css" href="style/default.css" /><link rel="stylesheet" type="text/css" href="style/hi-res.css" />' + printContent.innerHTML);
    printWindow.document.close();
    printWindow.focus();
    printWindow.print();
    printWindow.close();
}

在GridView是id为内容的中间一个div。

The gridview is in a div with id content middle.

感谢您

推荐答案

您可以包括在页面上的另一个GridView控件，将只用于打印。

You can include another GridView on the page, which will only be used for printing.

切换显示其中一个的方式是装饰两次与CSS类，合适的。

The way to toggle which one is shown is to decorate the two with CSS classes, as appropriate.

例如：

<style>
@media print {
    .PrintOnly { display:block; }
    .ScreenOnly { display:none; }
  }
  @media screen {
    .PrintOnly { display:none; }
    .ScreenOnly { display:block; }
  }
</style>

这篇关于如何打印gridview的带滚动？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！