这几天做一个项目有用到表格显示数据的地方,客户要求重复的数据列需要合并,就总结了一下.NET控件GridView 和 Repeater 关于重复数据合并的方法。
这是合并之前的效果:
合并之后的效果图如下:
GridView示例 :
前台代码 :
1 <div id="SelectBox" style="height: 500px"> 2 <div id="BoxDiv" style="overflow: auto;"> 3 <%--Box类--%> 4 <label style="font-size: 15px; font-weight: 700"> 5 Box</label> 6 <table id="box" cellpadding="0" cellspacing="0" style=" 1800px;"> 7 <thead> 8 <tr> 9 <th rowspan="2" align="center" style=" 100px"> 10 Quotation Number 11 </th> 12 <th rowspan="2" align="center" style=" 100px"> 13 Program Name 14 </th> 15 <th rowspan="2" align="center" style=" 120px"> 16 Completed Size<br /> 17 成品尺寸 18 </th> 19 <th rowspan="2" align="center" style=" 100px"> 20 Components 21 </th> 22 <th rowspan="2" align="center" style=" 100px"> 23 Part Size 24 </th> 25 <th rowspan="2" align="center" style=" 150px"> 26 Material 27 </th> 28 <th colspan="2" align="center" style=" 200px"> 29 Printing Color 30 </th> 31 <th rowspan="2" align="center" style=" 100px"> 32 Finishing 33 </th> 34 <th rowspan="2" align="center" style=" 100px"> 35 Construction 36 </th> 37 <th rowspan="2" align="center" style=" 100px"> 38 Packing 39 </th> 40 <th rowspan="2" align="center" style=" 100px"> 41 Delivery 42 </th> 43 <th rowspan="2" align="center" style=" 100px"> 44 VAT 45 </th> 46 </tr> 47 <tr> 48 <th align="center" style=" 100px"> 49 色数 50 </th> 51 <th align="center" style=" 100px"> 52 专色 53 </th> 54 </tr> 55 </thead> 56 <tbody id="Tbody"> 57 <asp:Repeater ID="rptIncome" runat="server"> 58 <ItemTemplate> 59 <tr> 60 <td runat="server" id="td0"> 61 <%#Eval("Quotation")%> 62 </td> 63 <td runat="server" id="td1"> 64 <%#Eval("ProgranName")%> 65 </td> 66 <td runat="server" id="td2"> 67 <%#Eval("CompletedSize")%> 68 </td> 69 <td runat="server" id="td3"> 70 <%#Eval("Components")%> 71 </td> 72 <td runat="server" id="td4"> 73 <%#Eval("PartGD")%> * <%#Eval("PartKD")%> 74 </td> 75 <td runat="server" id="td5"> 76 <%#Eval("Material")%> 77 </td> 78 <td runat="server" id="td6"> 79 <%#Eval("PrintingZC").ToString().Substring(0,1)%>+<%#Eval("PrintingFC").ToString().Substring(0, 1)%> 80 </td> 81 <td runat="server" id="td7"> 82 <%#Eval("PrintingZB").ToString().Substring(0, 1)%>+<%#Eval("PrintingFB").ToString().Substring(0, 1)%> 83 </td> 84 <td runat="server" id="td8"> 85 <%#Eval("Finishing")%> 86 </td> 87 <td runat="server" id="td9"> 88 <%#Eval("Construction")%> 89 </td> 90 <td runat="server" id="td10"> 91 <%#Eval("Packing")%> 92 </td> 93 <td runat="server" id="td11"> 94 <%#Eval("Delivery")%> 95 </td> 96 <td runat="server" id="td12"> 97 <%#Eval("VAT")%> 98 </td> 99 100 101 </tr> 102 </ItemTemplate> 103 </asp:Repeater> 104 </tbody> 105 </table> 106 </div> 107 </div>
后台代码 :
public void DataBind() { var No = Request["rrdpn"]; Pipeline_Biz_EvaluationNoBll EvaluationNoBll = new Pipeline_Biz_EvaluationNoBll(); DataSet ds = new DataSet(); DataTable dt = DataForm(EvaluationNoBll.box(No)); this.rptIncome.DataSource = dt; this.rptIncome.DataBind(); for (int i = 0; i < 13; i++) // 遍历每一列 { string rpttd = "td"; string tdIdName1 = rpttd + i.ToString(); MergeCell(tdIdName1); // 把当前列的 td 的 ID文本作为方法的参数 } } /// <summary> /// /// </summary> /// <param name="tdIdName1">当前列当前行的 td 的ID文本</param> private void MergeCell(string tdIdName1) { for (int i = rptIncome.Items.Count - 1; i > 0; i--) // rptIncome.Items.Count - 1 数据总行数(数据从0开始) 遍历当前列的每一行 { MergeCellSet(tdIdName1, i); } } /// <summary> /// /// </summary> /// <param name="tdIdName1">当前列当前行的 td 的ID文本</param> /// <param name="i">当前行</param> private void MergeCellSet(string tdIdName1, int i) { HtmlTableCell cellPrev = rptIncome.Items[i - 1].FindControl(tdIdName1) as HtmlTableCell; // 获取下一行当前列的 td 所在的单元格 HtmlTableCell cell = rptIncome.Items[i].FindControl(tdIdName1) as HtmlTableCell; // 获取当前行当前列的 td 所在的单元格 cell.RowSpan = (cell.RowSpan == -1) ? 1 : cell.RowSpan; // 获取当前行当前列单元格跨越的行数 cellPrev.RowSpan = (cellPrev.RowSpan == -1) ? 1 : cellPrev.RowSpan; // 获取下一行当前列单元格跨越的行数 if (cell.InnerText == cellPrev.InnerText) { // 让下一行的当前单元格的跨越行数 + 当前行的跨越行数 cellPrev.RowSpan += cell.RowSpan; cell.Visible = false; // 隐藏当前行 //关键代码,再判断执行第2列的合并单元格方法 } }
Repeater :
前台代码 :
// table样式 <style> table { border-collapse:collapse; } table tr td,th { border:1px solid black; } </style> //***************** <div> <table> <tr> <th>一级</th> <th>二级</th> <th>三级</th> <th>四级</th> </tr> <asp:Repeater ID="rptIncome" runat="server"> <ItemTemplate> <tr> <td runat="server" id="td0"><%#Eval("aname") %></td> <td runat="server" id="td1"><%#Eval("bname") %></td> <td runat="server" id="td2"><%#Eval("cname") %></td> <td runat="server" id="td3"><%#Eval("dname") %></td> </tr> </ItemTemplate> </asp:Repeater> </table> </div> Repeater 前台代码
后台代码 :
public void DataBind() { string sql = "select a.aname,b.bname,c.cname ,d.dname from aa as a right join bb as b on a.aid=b.aid right join cc as c on b.bid=c.bid left join dd as d on d.cid=c.cid order by a.aid"; SqlDataAdapter sda = new SqlDataAdapter(sql, cn); DataSet ds = new DataSet(); sda.Fill(ds); rptIncome.DataSource = ds; rptIncome.DataBind(); for (int i = 0; i < 4; i++) // 遍历每一列 { string rpttd = "td"; string tdIdName1 = rpttd + i.ToString(); MergeCell(tdIdName1); // 把当前列的 td 的 ID文本作为方法的参数 } } /// <summary> /// /// </summary> /// <param name="tdIdName1">当前列当前行的 td 的ID文本</param> private void MergeCell(string tdIdName1) { for (int i = rptIncome.Items.Count - 1; i > 0; i--) // rptIncome.Items.Count - 1 数据总行数(数据从0开始) 遍历当前列的每一行 { MergeCellSet(tdIdName1, i); } } /// <summary> /// /// </summary> /// <param name="tdIdName1">当前列当前行的 td 的ID文本</param> /// <param name="i">当前行</param> private void MergeCellSet(string tdIdName1, int i) { HtmlTableCell cellPrev = rptIncome.Items[i - 1].FindControl(tdIdName1) as HtmlTableCell; // 获取下一行当前列的 td 所在的单元格 HtmlTableCell cell = rptIncome.Items[i].FindControl(tdIdName1) as HtmlTableCell; // 获取当前行当前列的 td 所在的单元格 cell.RowSpan = (cell.RowSpan == -1) ? 1 : cell.RowSpan; // 获取当前行当前列单元格跨越的行数 cellPrev.RowSpan = (cellPrev.RowSpan == -1) ? 1 : cellPrev.RowSpan; // 获取下一行当前列单元格跨越的行数 if (cell.InnerText == cellPrev.InnerText) { // 让下一行的当前单元格的跨越行数 + 当前行的跨越行数 cellPrev.RowSpan += cell.RowSpan; cell.Visible = false; // 隐藏当前行 //关键代码,再判断执行第2列的合并单元格方法 } }
以上所述是给大家介绍的ASP.NET中 重复表格列合并的实现方法
原文链接:http://www.cnblogs.com/hanxiaofei/archive/2016/08/18/5784936.html