你的位置:首页 > 网页设计

[网页设计]ASP.NET 关于GridView 表格重复列合并


这几天做一个项目有用到表格显示数据的地方,客户要求重复的数据列需要合并,就总结了一下GridView 和 Repeater 关于重复数据合并的方法。

 

 

效果图如下 :

 

 

 


GridView :

前台代码 :

 1 <div> 2   <asp:GridView ID="gvIncome" runat="server" AutoGenerateColumns="False"> 3       <Columns> 4         <asp:TemplateField HeaderText="一级">   5           <ItemTemplate> 6             <asp:Label ID="Label0" runat="server" Text='<%#Eval("aname") %>'></asp:Label> 7           </ItemTemplate> 8         </asp:TemplateField> 9         <asp:TemplateField HeaderText="二级">10           <ItemTemplate>11             <asp:Label ID="Label1" runat="server" Text='<%#Eval("bname") %>'></asp:Label>12           </ItemTemplate>13         </asp:TemplateField>14         <asp:TemplateField HeaderText="三级">15           <ItemTemplate>16             <asp:Label ID="Label2" runat="server" Text='<%#Eval("cname") %>'></asp:Label>17           </ItemTemplate>18         </asp:TemplateField>19          <asp:TemplateField HeaderText="四级">20           <ItemTemplate>21             <asp:Label ID="Label3" runat="server" Text='<%#Eval("dname") %>'></asp:Label>22           </ItemTemplate>23         </asp:TemplateField>24       </Columns>25     </asp:GridView>26   </div>

GridView 前台代码
 

后台代码  :  

 1 public void DataBind() 2     { 3       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"; 4       SqlDataAdapter sda = new SqlDataAdapter(sql, cn); 5       DataSet ds = new DataSet(); 6       sda.Fill(ds); 7       gvIncome.DataSource = ds; 8       gvIncome.DataBind(); 9       //MergeRows(gvIncome.HeaderRow, gvIncome.Rows.Count);10       int colnum = gvIncome.Columns.Count; //  获取GridView中获取列数11       MergeRows(gvIncome, 4, "Label");  //  GridView  要整合的列数  需要改变的Lable控件12     }13     public static void MergeRows(GridView gvw, int colnum, string controlNameo)14     {15       for (int col = 0; col < colnum; col++)   //  遍历每一列16       {17         string controlName = controlNameo + col.ToString();  // 获取当前列需要改变的Lable控件ID18         for (int rowIndex = gvw.Rows.Count - 2; rowIndex >= 0; rowIndex--)   //GridView中获取行数  并遍历每一行19         {20           GridViewRow row = gvw.Rows[rowIndex];    // 获取当前行21           GridViewRow previousRow = gvw.Rows[rowIndex + 1];  // 获取当前行 的上一行22           Label row_lbl = row.Cells[col].FindControl(controlName) as Label;  //// 获取当前列当前行 的 Lable 控件ID 的文本23           Label previousRow_lbl = previousRow.Cells[col].FindControl(controlName) as Label;  //// 获取当前列当前行 的上一行 的 Lable控件ID 的文本24           if (row_lbl != null && previousRow_lbl != null)  //  如果当前行 和 上一行 要改动的 Lable 的ID 的文本不为空25           {26             if (row_lbl.Text == previousRow_lbl.Text)   //  如果当前行 和 上一行 要改动的 Lable 的ID 的文本不为空 且相同27             {28               //  当前行的当前单元格(单元格跨越的行数。 默认值为 0 ) 与下一行的当前单元格的跨越行数相等且小于一 则 返回2 否则让上一行行的当前单元格的跨越行数+129               row.Cells[col].RowSpan = previousRow.Cells[col].RowSpan < 1 ? 2 : previousRow.Cells[col].RowSpan + 1;30               //并让上一行的当前单元格不显示31               previousRow.Cells[col].Visible = false;32             }33           }34         }35       }36      37     }

GridView 后台代码

 

 

********************************************************
*                华丽的分割线                *
********************************************************

Repeater :

前台代码 :

 

 1 // table样式 2 <style> 3     table { 4       border-collapse:collapse; 5     } 6       table tr td,th { 7         border:1px solid black; 8       } 9 </style>10 11 //*****************12 13 <div>14    <table>15      <tr>16        <th>一级</th> <th>二级</th> <th>三级</th> <th>四级</th>17      </tr>18      <asp:Repeater ID="rptIncome" runat="server">19        <ItemTemplate>20          <tr>21            <td runat="server" id="td0"><%#Eval("aname") %></td>22            <td runat="server" id="td1"><%#Eval("bname") %></td>23            <td runat="server" id="td2"><%#Eval("cname") %></td>24            <td runat="server" id="td3"><%#Eval("dname") %></td>25          </tr>26        </ItemTemplate>27      </asp:Repeater>28    </table>29 </div>

Repeater 前台代码

 

后台代码  :

 1    public void DataBind() 2     { 3       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"; 4       SqlDataAdapter sda = new SqlDataAdapter(sql, cn); 5       DataSet ds = new DataSet(); 6       sda.Fill(ds); 7       rptIncome.DataSource = ds; 8       rptIncome.DataBind(); 9 10       for (int i = 0; i < 4; i++)  // 遍历每一列11       {12         string rpttd = "td";13         string tdIdName1 = rpttd + i.ToString();14         MergeCell(tdIdName1);  // 把当前列的 td 的 ID文本作为方法的参数15       }16       17     }18 19     /// <summary>20     /// 21     /// </summary>22     /// <param name="tdIdName1">当前列当前行的 td 的ID文本</param>23     private void MergeCell(string tdIdName1)24     {25       for (int i = rptIncome.Items.Count - 1; i > 0; i--) // rptIncome.Items.Count - 1 数据总行数(数据从0开始)   遍历当前列的每一行26       {27         MergeCellSet(tdIdName1, i);   28       }   29     }30     /// <summary>31     /// 32     /// </summary>33     /// <param name="tdIdName1">当前列当前行的 td 的ID文本</param>34     /// <param name="i">当前行</param>35     private void MergeCellSet(string tdIdName1, int i)36     {37       HtmlTableCell cellPrev = rptIncome.Items[i - 1].FindControl(tdIdName1) as HtmlTableCell; // 获取下一行当前列的 td 所在的单元格38       HtmlTableCell cell = rptIncome.Items[i].FindControl(tdIdName1) as HtmlTableCell;  // 获取当前行当前列的 td 所在的单元格39       cell.RowSpan = (cell.RowSpan == -1) ? 1 : cell.RowSpan;  //  获取当前行当前列单元格跨越的行数  40       cellPrev.RowSpan = (cellPrev.RowSpan == -1) ? 1 : cellPrev.RowSpan; //  获取下一行当前列单元格跨越的行数 41       if (cell.InnerText == cellPrev.InnerText)42       {43         //  让下一行的当前单元格的跨越行数  + 当前行的跨越行数44         cellPrev.RowSpan += cell.RowSpan;45         cell.Visible = false;   // 隐藏当前行46 47         //关键代码,再判断执行第2列的合并单元格方法48       }49     } 

Repeater 后台代码