在 asp.net 中的多个页面上打印具有许多列标题的 Datagrid 表
Posted
技术标签:
【中文标题】在 asp.net 中的多个页面上打印具有许多列标题的 Datagrid 表【英文标题】：Print Datagrid table with many column headers accross multiple pages in asp.net 【发布时间】：2015-01-26 19:08:39 【问题描述】：我无法进一步解释标题，所以请根据下面的链接。 我在 ASP.net 中使用 VB 代码使用 DataGrid（不是 GridView）。
这是我在数据网格中的当前显示 click here to view picture1 ，我想让它像这样clck here to view picture2
如果我有多个列，我的目的是将我的数据网格拆分为多个数据网格。 我需要拆分它们，以便可以很好地在 Google Chrome 中打印。因为使用javascript的window.print在图1中的打印预览是它自动将我的多列放在一个dataGrid中，因此，如果我有20列数据，我的列间距会很小而且不会用户可读。像这样click here to view picture3
如果您对如何在浏览器中打印我的数据网格有任何建议，不胜感激， TIA。
<asp:DataGrid Visible ="true" OnItemDataBound="Item_Bound" ID="dgSheet"
runat="server" BackColor="White" BorderColor="black" BorderStyle="None"
BorderWidth="1px" CellSpacing="0" CellPadding="0" Width="100%" PageSize="5"
CssClass="Narrow" ForeColor="Black">
<EditItemStyle BackColor="#999999" />
<FooterStyle BackColor="#2980b9" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2980b9" ForeColor="White" HorizontalAlign="Center" />
<ItemStyle Font-Size="12px" Width="200" ForeColor="#333333" />
<HeaderStyle Font-Bold="true" Font-Size="12px" Width="200" ForeColor="black" />
<SelectedItemStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
</asp:DataGrid>
用于在数据网格中显示我的数据的部分代码：
Dim o_Row As DataRow
Dim o_AdmDates As New Collection()
Dim s_LastAdmDate As String = ""
Dim s_AdmDate As String = ""
Dim o_DerivedTable As New DataTable()
With o_DerivedTable
.Columns.Add("TransDate")
.Columns.Add("Medication")
.Columns.Add("Dosage")
.Columns.Add("TransNum")
.Columns.Add("AdministeredDate")
.Columns.Add("newAdmed")
End With
'Sort by administered dates
Dim o_FoundRows As DataRow() = o_Dataset.Tables(0).Select("", "AdministeredDate Desc")
'Extract distinct administered dates
For Each o_Row In o_FoundRows
s_AdmDate = Format(CDate(o_Row.Item("AdministeredDate")), KC_Date_Format2)
If s_LastAdmDate <> s_AdmDate Then
s_LastAdmDate = s_AdmDate
o_AdmDates.Add(s_LastAdmDate)
End If
Next
'Add administred date to derived table
Dim o_Item As String
For Each o_Item In o_AdmDates
o_DerivedTable.Columns.Add(o_Item)
Next
'Loop through the administred date
Dim o_NewRow As DataRow
Dim o_NextRow As DataRow
Dim i_Ctr As Integer
Dim x_isNewRow As Boolean = True
Dim i_MaxRec As Integer
i_MaxRec = o_Dataset.Tables(0).Rows.Count - 1
For i_Ctr = 0 To i_MaxRec
o_Row = o_Dataset.Tables(0).Rows(i_Ctr)
If i_Ctr <> i_MaxRec Then
o_NextRow = o_Dataset.Tables(0).Rows(i_Ctr + 1)
End If
If x_isNewRow Then
o_NewRow = o_DerivedTable.NewRow()
End If
o_NewRow("TransDate") = o_Row("TransDate")
o_NewRow("Medication") = o_Row("Medication")
o_NewRow("Dosage") = o_Row("Dosage")
o_NewRow("TransNum") = o_Row("TransNum")
o_NewRow("AdministeredDate") = Format(CDate(o_Row("AdministeredDate")), KC_Date_Format2)
o_NewRow("newAdmed") = o_Row("newAdmed")
'Fill approriate result date column based on query
For Each o_Item In o_AdmDates
s_AdmDate = Format(CDate(o_Row("AdministeredDate")), KC_Date_Format2)
Dim AdmTim As DateTime = DateTime.Parse(o_Row("AdministeredDate"))
If s_AdmDate = o_Item Then
o_NewRow(s_AdmDate) = AdmTim.ToString("hh:mm tt") + " - " + o_Row("UserID")
End If
Next
If i_Ctr < i_MaxRec _
AndAlso Not o_NextRow Is Nothing _
AndAlso o_Row("TransDate") = o_NextRow("TransDate") _
AndAlso o_Row("Medication") = o_NextRow("Medication") _
AndAlso o_Row("AdministeredDate") = o_NextRow("AdministeredDate") Then
x_isNewRow = False
Else
o_DerivedTable.Rows.Add(o_NewRow)
x_isNewRow = True
End If
Next
dgSheetPrint.DataSource = o_DerivedTable
dgSheetPrint.DataBind()
【问题讨论】：
您将无法从服务器端进行操作，请为表格提供生成的代码。 @Ratna 我已经编辑了我的问题，你可以看看我后面的代码。 我需要 html 而不是服务器端代码，用我自己的表格代码找到答案。 【参考方案1】：首先我想说的是，您不是在打印数据网格，而是在打印由此生成的 html。 因此，您需要在客户端做一些事情。既然你已经写了你需要打破表格然后打印我正在附加一个 html 页面，你可以从中复制代码并将其更改为与数据网格生成的 html 一起使用，你至少需要更改数据网格的 id。
代码如下
[由于您没有提供生成的 html，因此我制作了一个类似的表格]
<table id="previousOrderExports" class="chromeTheme">
<tr>
<td class="bold">Export ID</td>
<td class="bold">Request Type</td>
<td class="bold">Timeframe</td>
<td class="bold">Search Filter</td>
<td class="bold">Search Term</td>
<td class="bold">Requested on</td>
<td class="bold">Processed on</td>
<td class="bold">Export Status</td>
<td class="bold">Download</td>
</tr>
<tr>
<td>143306</td>
<td>manual</td>
<td>11/8/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/08/14 03:37:00 AM PST</td>
<td>12/08/14 03:37:08 AM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/143306">Download</a></td>
</tr>
<tr>
<td>142873</td>
<td>auto</td>
<td>12/7/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/08/14 01:01:10 AM PST</td>
<td>12/08/14 01:03:00 AM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/142873">Download</a></td>
</tr>
<tr>
<td>142766</td>
<td>auto</td>
<td>12/7/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/07/14 11:01:03 PM PST</td>
<td>12/07/14 11:02:04 PM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/142766">Download</a></td>
</tr>
<tr>
<td>142752</td>
<td>auto</td>
<td>12/7/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/07/14 10:01:03 PM PST</td>
<td>12/07/14 10:02:05 PM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/142752">Download</a></td>
</tr>
<tr>
<td>142738</td>
<td>auto</td>
<td>12/7/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/07/14 09:01:03 PM PST</td>
<td>12/07/14 09:02:07 PM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/142738">Download</a></td>
</tr>
<tr>
<td>142723</td>
<td>auto</td>
<td>12/7/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/07/14 08:01:02 PM PST</td>
<td>12/07/14 08:02:04 PM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/142723">Download</a></td>
</tr>
<tr>
<td>142709</td>
<td>auto</td>
<td>12/7/14 - 12/8/14</td>
<td>Timespan</td>
<td></td>
<td>12/07/14 07:01:03 PM PST</td>
<td>12/07/14 07:02:04 PM PST</td>
<td>Done</td>
<td><a href="fghhsd.dsfd/sfre/142709">Download</a></td>
</tr>
</table>
<input id="Button1" type="button" value="Print" onclick="print_breakup_table()" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" language="javascript" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
function print_breakup_table()
var tableid = "previousOrderExports"; //id of table in this case cliend side id of your datagrid
var fixedcols = 2;// no. of columns 0 index based that will be repeated on every page
var eachpagecols = 3; // no. of columns that will get printed on each page
var colCount = 0;
$('#' + tableid + ' tr:nth-child(1) td').each(function ()
if ($(this).attr('colspan'))
colCount += +$(this).attr('colspan');
else
colCount++;
);
colCount--; //get 0 based columncount
var col_left_after_fixed_col = colCount - fixedcols;
var pagerequired = col_left_after_fixed_col / eachpagecols;
if ((col_left_after_fixed_col % eachpagecols)>0)
pagerequired++;
for (var i = 0; i < pagerequired; i++)
var html = "<table>";
var startcols = fixedcols + (i * eachpagecols);
var endcols = startcols + eachpagecols;
//add fixed cols
$('#' + tableid + ' tr').each(function ()
html += "<tr>";
$(this).children('td').each(function (index, object)
if (index <= fixedcols)
html += "<td>" + $(this).html() + "</td>";
else
if (index <= endcols && index >= startcols)
html += "<td>" + $(this).html() + "</td>";
);
html += "</tr>";
);
html += "</table>";
myWindow = window.open('', '', 'width=800,height=600');
myWindow.document.write(html);
myWindow.document.close();
myWindow.focus();
myWindow.print();
</script>
【讨论】：
我已经删除了您创建的表格，并将 javascript 上的表格 ID 更改为我的 DataGrid ID，它可以工作，但我需要对其进行调整。谢谢！【参考方案2】：您将需要专门编写一个以您想要的方式包含表格的视图。然后你可以添加一个按钮来打印它
<a class="miniprint" href="/url/to/print/view">Print</a>
Javascript：
$(document).on('click', '.miniprint', function (event)
event.preventDefault();
var self = $(this);
var url = self.attr("href");
$("#printjob").remove();
$('<iframe id="printjob" src="' + url + '">')
.load(function ()
this.focus();
document.getElementById("printjob").contentWindow.print();
)
.css( position: "absolute", left: "-10000px", top: "0px" )
.appendTo(document.body);
);
另外，我建议告诉谷歌浏览器使用
以横向打印它@media print
@page size: landscape
【讨论】：
我已经有了要打印的表格，即 DataGrid。我的问题是如何将我的数据网格分成多列，比如说 7 列，以便每周对其进行排序。【参考方案3】：如果您仍想使用 window.print：不要依赖内联样式，而是创建 2 个单独的样式表：media="screen" & media="print"
使用报告引擎来完全控制结果，例如水晶报表、Telerik 报表等
【讨论】：
我正在使用 Visual Studio 2013，但我在水晶报表方面遇到了问题，这就是我改用 datagrid 的原因以上是关于在 asp.net 中的多个页面上打印具有许多列标题的 Datagrid 表的主要内容，如果未能解决你的问题，请参考以下文章
如何在 asp.net core .NET6（Razor 页面）中的单个 cshtml 中显示来自多个表/模型的数据