Asp.Net下的DataGrid的多层表头样式实现（一）

要实现以下样式（跨行跨列）：

实际上Asp.Net下的DataGrid控件只不过是一个HtmlTable，只不过在HtmlTable的基础上添加了很多属性、方法，纳入ViewState机制，来生成、控制它。

我们可以在属性生成器中定义列的表头。它实际上只不过是在列之间插入了<td></td>的html标记。我是在’审核’列后添加<tr> <td colspan=\"2\">一档</td><td colspan=\"2\">二档</td> <td colspan=\"2\">一档</td><td colspan=\"2\">二档</td> </tr>"这时你会发现2层表头就出现了。

具体是在DataGrid的OnItemDataBound事件中处理，跨行跨列的合并。前台代码就不在这里展示了，后台代码如下：

   protected void dg_list_ItemDataBound(object sender, DataGridItemEventArgs e)
     {   
         #region  多维表头设计
         if (e.Item.ItemType == ListItemType.Header)
         {
             e.Item.Cells[0].RowSpan = 3;//控件中单元格跨越的行数
             e.Item.Cells[1].RowSpan = 3;
             e.Item.Cells[2].RowSpan = 3;
 
             e.Item.Cells[3].ColumnSpan = 4;//控件中单元格跨越的列数
             e.Item.Cells[3].HorizontalAlign = HorizontalAlign.Center;
             e.Item.Cells[3].Text = "医生正常（个/天）</td>";

             e.Item.Cells[4].ColumnSpan = 4;
             e.Item.Cells[4].HorizontalAlign = HorizontalAlign.Center;
             e.Item.Cells[4].Text = "护士正常（个/天）</td>";
             
             e.Item.Cells[5].ColumnSpan = 1;
             e.Item.Cells[5].RowSpan = 3;
             e.Item.Cells[5].HorizontalAlign = HorizontalAlign.Center;
             e.Item.Cells[5].Text = "修改</td>";

             e.Item.Cells[6].ColumnSpan = 1;
             e.Item.Cells[6].RowSpan = 3;
             e.Item.Cells[6].HorizontalAlign = HorizontalAlign.Center;
             e.Item.Cells[6].Text = "删除</td>";

             e.Item.Cells[7].ColumnSpan = 1;
             e.Item.Cells[7].RowSpan = 3;
             e.Item.Cells[7].HorizontalAlign = HorizontalAlign.Center;
             e.Item.Cells[7].Text = "审核</td></tr>"
                 + "<tr align=\"center\" style=\"color:#000088;background-color:#ECEFF8;height:30px;\">"
                 + "<td colspan=\"2\">一档</td><td colspan=\"2\">二档</td>"
                 + "<td colspan=\"2\">一档</td><td colspan=\"2\">二档</td>" 
                 + "</tr>"

                 + "<tr align=\"center\" style=\"color:#000088;background-color:#ECEFF8;height:30px;\">"
                 + "<td>大夜</td><td>小夜</td><td>大夜</td><td>小夜</td>"
                 + "<td>大夜</td><td>小夜</td><td>大夜</td><td>小夜</td>" 
                 + "</tr>";
             for (int i = 8; i < 14; i++)
             {
                 e.Item.Cells[i].Visible = false;
             }
         }
         #endregion 多维表头设计 
     }

好了，这样就实现了。暂时就写到这里，不完善的地方请大家补充，有错误的地方请大家指正。