DataList 嵌套GridView实现文章分类列表显示

DataList 嵌套GridView实现文章分类列表显示

昨天晚上花了三个多小时写一个程序实现下面这种功能的：
现在我把我的代码贴上来大家分享一下，这个用到一个DataList，和GridView。先到Dreamwaver里面把布局布好，我用的是 div+css布局的
然后在DataList中嵌套进GridView控件，在把样式做好，然后就开始写代码了
.aspx中代码：

 1 < div id = " div_bodyright " >
 2
 3 < asp:DataList ID = " list "  runat = " server "  RepeatColumns = " 2 "  RepeatDirection = " Horizontal "  DataKeyField = " TypeID "
 4     RepeatLayout = " Flow "  OnItemDataBound = " list_ItemDataBound " >
 5      < ItemTemplate >
 6          < div id = " div11 "  class = " bodyleft " >
 7              < div id = " title1 "  class = " cls_title " >
 8                  < div id = " tl1 "  class = " cls_tleft " >< img src = " images/bullet1.gif "  alt = " Title " />& nbsp; < label id = " t1 "  class = " lbTxt " ><% # DataBinder.Eval(Container.DataItem,  " TypeName " ) %></ label ></ div >
 9                  < div id = " tr1 "  class = " cls_tright " >< img src = " images/more.gif "  alt = " More "  /></ div >  
10              </ div >
11              < div id = " list1 "  class = " divlist " >
12              < asp:GridView ID = " gvArticle1 "  runat = " server "  ShowHeader = " false "  ShowFooter = " false "  AutoGenerateColumns = " False "   CellPadding = " 4 "  ForeColor = " #333333 "  GridLines = " None "  width = " 100% " >
13              < FooterStyle BackColor = " #5D7B9D "  Font - Bold = " True "  ForeColor = " White "  />
14                  < Columns >
15                      < asp:TemplateField HeaderText = " 标题 " >
16                          < ItemStyle Width = " 80% "  />
17                          < ItemTemplate >
18                              < asp:HyperLink ID = " title "  runat = " server "  NavigateUrl = ' <%#"Article.aspx?aid=" + DataBinder.Eval(Container.DataItem,"ArticleId")%> '  title = ' <%#"标 题：" + DataBinder.Eval(Container.DataItem, "ArticleTitle") + "\n发布日 期：" + DataBinder.Eval(Container.DataItem,"ArticleDateTime") + "\n点击 量：" + DataBinder.Eval(Container.DataItem,"ArticleClick")%> ' ><% # DataBinder.Eval(Container.DataItem,  " ArticleTitle " ) %></ asp:HyperLink >
19                          </ ItemTemplate >
20                      </ asp:TemplateField >
21                      < asp:BoundField DataField = " ArticleDate "  HeaderText = " 日期 "  ItemStyle - Width = " 20% "  />
22                     
23                  </ Columns >
24                  < RowStyle BackColor = " #F7F6F3 "  ForeColor = " #333333 "  />
25                  < EditRowStyle BackColor = " #999999 "  />
26                  < SelectedRowStyle BackColor = " #E2DED6 "  Font - Bold = " True "  ForeColor = " #333333 "  />
27                  < PagerStyle BackColor = " #284775 "  ForeColor = " White "  HorizontalAlign = " Center "  />
28                  < HeaderStyle BackColor = " #5D7B9D "  Font - Bold = " True "  ForeColor = " White "  />
29                  < AlternatingRowStyle BackColor = " White "  ForeColor = " #284775 "  />
30              </ asp:GridView >
31              </ div >
32          </ div >
33      </ ItemTemplate >
34      < AlternatingItemTemplate >
35          < div id = " div12 "  class = " bodyright " >
36              < div id = " title2 "  class = " cls_title " >
37                  < div id = " tl2 "  class = " cls_tleft " >< img src = " images/bullet1.gif "  alt = " Title " />& nbsp; < label id = " t2 "  class = " lbTxt " ><% # DataBinder.Eval(Container.DataItem,  " TypeName " ) %></ label ></ div >
38                  < div id = " tr2 "  class = " cls_tright " >< img src = " images/more.gif "  alt = " More "  /></ div >
39              </ div >
40              < div id = " list1 "  class = " divlist " >
41              < asp:GridView ID = " gvArticle2 "  runat = " server "  ShowHeader = " false "   AutoGenerateColumns = " False "  ShowFooter = " false "  CellPadding = " 4 "  ForeColor = " #333333 "  GridLines = " None "   width = " 100% " >
42              < FooterStyle BackColor = " #5D7B9D "  Font - Bold = " True "  ForeColor = " White "  />
43                  < Columns >
44                      < asp:TemplateField HeaderText = " 标题 " >
45                          < ItemStyle Width = " 80% "  />
46                          < ItemTemplate >
47                              < asp:HyperLink ID = " title "  runat = " server "  NavigateUrl = ' <%#"Article.aspx?aid=" + DataBinder.Eval(Container.DataItem,"ArticleId")%> '  title = ' <%#"标 题：" + DataBinder.Eval(Container.DataItem, "ArticleTitle") + "\n发布日 期：" + DataBinder.Eval(Container.DataItem,"ArticleDateTime") + "\n点击 量：" + DataBinder.Eval(Container.DataItem,"ArticleClick")%> ' ><% # DataBinder.Eval(Container.DataItem,  " ArticleTitle " ) %></ asp:HyperLink >
48                          </ ItemTemplate >
49                      </ asp:TemplateField >
50                      < asp:BoundField DataField = " ArticleDate "  HeaderText = " 日期 "  ItemStyle - Width = " 20% "  />
51                     
52                  </ Columns >
53                  < RowStyle BackColor = " #F7F6F3 "  ForeColor = " #333333 "  />
54                  < EditRowStyle BackColor = " #999999 "  />
55                  < SelectedRowStyle BackColor = " #E2DED6 "  Font - Bold = " True "  ForeColor = " #333333 "  />
56                  < PagerStyle BackColor = " #284775 "  ForeColor = " White "  HorizontalAlign = " Center "  />
57                  < HeaderStyle BackColor = " #5D7B9D "  Font - Bold = " True "  ForeColor = " White "  />
58                  < AlternatingRowStyle BackColor = " White "  ForeColor = " #284775 "  />
59              </ asp:GridView >      
60              </ div >        
61          </ div >
62      </ AlternatingItemTemplate >
63 </ asp:DataList >
64 </ div >

.cs中的代码：

    BllArticle bll  =  new  BllArticle();

     protected  void  Page_Load( object  sender, EventArgs e)
     {
        if (!IsPostBack)
        {
            list.DataSource = bll.GetTypeList(false);
            list.DataBind();
        }
    }
     protected  void  list_ItemDataBound( object  sender, DataListItemEventArgs e)
     {
        if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
        {
            if (e.Item.ItemType == ListItemType.Item)
            {
                GridView gvList1 = (GridView)e.Item.FindControl("gvArticle1");

                gvList1.DataSource = bll.GetArticles(int.Parse(list.DataKeys[e.Item.ItemIndex].ToString()));
                gvList1.DataBind();

            }
            if (e.Item.ItemType == ListItemType.AlternatingItem)
            {                
                GridView gvList2 = (GridView)e.Item.FindControl("gvArticle2");
                gvList2.DataSource = bll.GetArticles(int.Parse(list.DataKeys[e.Item.ItemIndex].ToString()));
                gvList2.DataBind();
            }
        }
    }

在数据层中的代码：

         /// <summary>
        /// 获取文章类别的信息 IsAll是不是显示全部信息
        /// </summary>
        /// <param name="IsAll">true 显示所有，false 显示允许显示的内容</param>
        /// <returns></returns>
         public  DataSet GetTypeList( bool  IsAll)
         {
            using (SqlConnection conn = new SqlConnection(DBSqlHelper.DBConnectionString))
            {
                StringBuilder sb = new StringBuilder();
                if(IsAll)
                {
                    sb.Append(" select * from Info_Type order by TypeOrder desc");
                    return DBSqlHelper.GetDataSet(conn,CommandType.Text,sb.ToString());
                }
                else
                {
                    sb.Append(" select * from Info_Type where TypeVisible=@Visible order by TypeOrder desc");
                    SqlParameter parm = new SqlParameter("@Visible",SqlDbType.VarChar,0);
                    parm.Value = "1";
                    return DBSqlHelper.GetDataSet(conn, CommandType.Text, sb.ToString(), parm);
                }
            }
        }

         /// <summary>
        /// 获取前N条文章列表数据
        /// </summary>
        /// <param name="TypeID"></param>
        /// <returns></returns>
         public  DataSet GetArticles( int  TypeID)
         {
            using (SqlConnection conn = new SqlConnection(DBSqlHelper.DBConnectionString))
            {
                StringBuilder sb = new StringBuilder();
                sb.Append(" select top 10 ArticleId,ArticleTitle,replace(convert(varchar(12),ArticleDate,111),'/','-') as ArticleDate,");
                sb.Append(" ArticleDate as ArticleDateTime,ArticleClick from Info_Article where ArticleType=@typeid order by ArticleId desc");

                SqlParameter parm = new SqlParameter("@typeid", SqlDbType.Int, 0);
                parm.Value = TypeID;

                return DBSqlHelper.GetDataSet(conn, CommandType.Text, sb.ToString(),parm);
            }
        }

这样就可以了，不过我这里就不把CSS文件的代码贴上来了，实现的效果就是上面截图那样的