頭位置不固定的，而印刷，

有用於填充數據的網格，頭位置不固定的，而印刷，

<asp:Panel ID="Panel1" runat="server" ScrollBars="Auto" Width="1000px" 
    Height="8000px" BorderColor="Black" BorderWidth="1px" Visible="true" BackColor="LightGray"> 
<asp:GridView ID="List" runat="server" Visible="False" OnRowDataBound="List_RowDataBound" AutoGenerateColumns="true"> 

     <HeaderStyle CssClass="gridstyleHead" /> 
     <RowStyle CssClass="gridRowstyle" /> 

</asp:GridView>

並且存在適用於網格

.gridstyleHead { 
white-space: nowrap; 
text-align: left; 
font-family: Arial; 
font-size: 10pt; 
font-weight: lighter; 
padding-left: 3px; 
position: relative; 
top: expression(this.offsetParent.scrollTop); 
z-index: 10; 
} 

.gridRowstyle { 
white-space: nowrap; 
border-width: 1px; 
background-color: white; 
font-family: Arial; 
font-size: 9pt; 
height: 29px;

}

的樣式表我正嘗試打印網格中的數據

function btnPrint_Click() { 
varfoo="toolbar=yes,location=no,directories=yes,menubar=yes,scrollbars=yes, 
width=500,height=600,left=50,top=25"; 


    varprintdata=document.getElementById('<%=Panel1.ClientID%>').innerHTML; 
     var printWindow = window.open('', 'PRINT', foo); 
     var radioButtons = document.getElementsByName("ordrcvd"); 
     var ord = ''; 
     for (var x = 0; x < radioButtons.length; x++) { 
      if (radioButtons[x].checked) { 
       ord = radioButtons[x].value; 
      } 
     } 
     printWindow.document.write('<html><head><link rel="stylesheet" href="css/invoice.css" />'); 
     printWindow.document.write(' </head><body>'); 
     printWindow.document.write('<table>'); 
     printWindow.document.write('<tr><td style = "font-weight:bold;font-family:arial;font-size:12"> order Received' + '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : '); 
     printWindow.document.write('</td><td style = "font-weight:normal;font-family:arial;font-size:12">'); 
     printWindow.document.write(document.getElementById('<%= txtordRcvd.ClientID%>').value); 
     printWindow.document.write('</td></tr>'); 
     printWindow.document.write('<tr><td> </br>'); 
     printWindow.document.write('</td></tr>'); 
     printWindow.document.write(' </table>'); 
     printWindow.document.write(printContent); 
     printWindow.document.write('</body></html>'); 
     printWindow.document.close(); 
     printWindow.focus(); 

     return false; 
    }

但問題是網格中的標題不是固定的，並且我正在打印的網頁顯示的標題不是固定的。

網格中的標題不是固定的，但是當我試圖打印該網格並向下滾動時，標題位置錯位。

任何人都可以提出如何應用樣式表是我打印網格，使頭將被固定在事先

感謝，

來源

2017-05-30 Aj here

您需要使用打印媒體查詢。我不能測試它是確定的，但我相信你想要這樣的東西：

@media print { 
    .gridstyleHead { 
     top: 0; 
    } 
}

或任何數字讓你的頭在正確的位置。

來源

2017-05-30 20:26:19 sn3ll

這是我的解決方案，我試過這種方式，它適合我，之前（有問題提到）有一個面板叫panel1，數據綁定到該面板中的網格，樣式表應用於表示要修復標題的網格。現在，我拿了另一個類似於Panel1的面板，並將其命名爲Panel2，但應用了樣式，以便它不顯示數據並將數據綁定到該面板中的網格，類似於之前的過程和樣式表應用於該網格，標題爲「不固定」。希望我的解釋不錯。

步驟我遵循：

我包括一類對現有的CSS文件除去表述「頂部：表達式（this.offsetParent.scrollTop）;」從gridstyleHead

.gridstyleHeadlocal 
{ 
white-space: nowrap; 
text-align: left; 
font-family: Arial; 
font-size: 10pt; 
font-weight: lighter; 
padding-left: 3px; 
position: relative; 

z-index: 10; 
}

，現在我又是Panel2其作用就像是Panel1爲正在申請的風格爲它的風格=顯示：無

<asp:Panel ID="Panel2" style = "Display:none" runat="server" 
ScrollBars="Auto" Width="1000px" 
     Height="8000px" BorderColor="Black" BorderWidth="1px" 
     Visible="true" 
     BackColor="LightGray"> 
     <asp:GridView ID="Listlocal" runat="server" Visible="False" 
     OnRowDataBound="List_RowDataBound" AutoGenerateColumns="true"> 

     <HeaderStyle CssClass="gridstyleHeadlocal" /> 
     <RowStyle CssClass="gridRowstyle" /> 

</asp:GridView>

，並使用的document.getElementById在打印按鈕功能稱爲是Panel2 （'<％= Panel2.ClientID％>'）。innerHTML;

function btnPrint_Click() { 
varfoo="toolbar=yes,location=no,directories=yes,menubar=yes,scrollbars=yes,width=500,height=600,left=50,top=25"; 


    varprintdata=document.getElementById('<%=Panel2.ClientID%>').innerHTML; 
    var printWindow = window.open('', 'PRINT', foo); 
    var radioButtons = document.getElementsByName("ordrcvd"); 
    var ord = ''; 
    for (var x = 0; x < radioButtons.length; x++) { 
     if (radioButtons[x].checked) { 
      ord = radioButtons[x].value; 
     } 
    } 
    printWindow.document.write('<html><head><link rel="stylesheet" href="css/invoice.css" />'); 
    printWindow.document.write(' </head><body>'); 
    printWindow.document.write('<table>'); 
    printWindow.document.write('<tr><td style = "font-weight:bold;font-family:arial;font-size:12"> order Received' + '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : '); 
    printWindow.document.write('</td><td style = "font-weight:normal;font-family:arial;font-size:12">'); 
    printWindow.document.write(document.getElementById('<%= txtordRcvd.ClientID%>').value); 
    printWindow.document.write('</td></tr>'); 
    printWindow.document.write('<tr><td> </br>'); 
    printWindow.document.write('</td></tr>'); 
    printWindow.document.write(' </table>'); 
    printWindow.document.write(printContent); 
    printWindow.document.write('</body></html>'); 
    printWindow.document.close(); 
    printWindow.focus(); 

    return false; 
    }

來源

2017-06-01 15:52:52

頭位置不固定的，而印刷，

回答

相關問題