爱站程序员基地ASP.NET Repeater的嵌套实现菜单动态加载
仿照淘宝做了个四级菜单，献丑啦
做出的效果是这样子的：
ASP.NET前端界面代码
<%--菜单导航的显示--%><ul class=\"section-shang-left-ul\"><asp:Repeater ID=\"rpDHCD1\" runat=\"server\" OnItemDataBound=\"rpDHCD1_ItemDataBound\"><ItemTemplate><%--一级分类展示--%><li class=\"section-shang-left-ul-li\" parentyijiid=\"<%#Eval(\"ID\") %>\"><asp:Repeater ID=\"rpDHCDz1\" runat=\"server\"><ItemTemplate><%--二级分类展示--%><span><a class=\"section-shang-left-ul-li-a\" parentid=\"<%#Eval(\"ParentID\") %>\" href=\"LieBiao.aspx?DH1=<%#Eval(\"TypeName\") %>\"><%#Eval(\"TypeName\")%> </a></span></ItemTemplate></asp:Repeater><%--大盒子--%><div class=\"section-shang-left-menu\" style=\"display:none;\" parenterjiid=\"<%#Eval(\"ID\") %>\"><%--菜单悬浮展示列表--%><div class=\"menu-panel-fu\" id=\"<%#Eval(\"ID\") %>\"><%--三级分类标题展示--%><asp:Repeater ID=\"rpmenuSanJi\" runat=\"server\" OnItemDataBound=\"rpmenuSanJi_ItemDataBound\"><ItemTemplate><div class=\"menu-panel-zi\"><h5><a class=\"menu-panel-zi-a\" parentid=\"<%#Eval(\"ParentID\") %>\" href=\"LieBiao.aspx?DH1=<%#Eval(\"TypeName\") %>\"><%#Eval(\"TypeName\")%></a></h5><div class=\"grid2\"><%--四级分类展示--%><asp:Repeater ID=\"rpMenuSiJi\" runat=\"server\"><ItemTemplate><div class=\"sijimenu\"><a class=\"menu-panel-zi-a-siji-a\" parentid=\"<%#Eval(\"ParentID\") %>\" href=\"LieBiao.aspx?DH1=<%#Eval(\"TypeName\") %>\"><%#Eval(\"TypeName\")%></a></div></ItemTemplate></asp:Repeater></div></div></ItemTemplate></asp:Repeater></div></div></li></ItemTemplate></asp:Repeater></ul></div>
C#后端代码：
protected void Page_Load(object sender, EventArgs e){if (!IsPostBack){rpDHCD1.DataSource = TbIndexManager.SelectDHCD();rpDHCD1.DataBind();}}protected void rpDHCD1_ItemDataBound(object sender, RepeaterItemEventArgs e){//菜单导航二级分类绑定数据Repeater rpDHCDz1 = e.Item.FindControl(\"rpDHCDz1\") as Repeater;TbGoodsType yijiType =(TbGoodsType)e.Item.DataItem;rpDHCDz1.DataSource = TbIndexManager.SelectDHCDz1(yijiType.ID);rpDHCDz1.DataBind();//菜单导航三级分类绑定数据Repeater rpmenuSanJi = e.Item.FindControl(\"rpmenuSanJi\") as Repeater;TbGoodsType sanjiType = (TbGoodsType)e.Item.DataItem;rpmenuSanJi.DataSource = TbIndexManager.SelectDHCDz1(sanjiType.ID);rpmenuSanJi.DataBind();}protected void rpmenuSanJi_ItemDataBound(object sender, RepeaterItemEventArgs e){//菜单导航四级分类绑定数据Repeater rpMenuSiJi = e.Item.FindControl(\"rpMenuSiJi\") as Repeater;TbGoodsType sijitype = (TbGoodsType)e.Item.DataItem;rpMenuSiJi.DataSource = TbIndexManager.SelectTbDHCDSiJi(sijitype.ID);rpMenuSiJi.DataBind();}
三层架构中的BLL层中的代码：
//一级菜单public static List<TbGoodsType> SelectDHCD(){SqlDataReader dr = TbIndexService.SelectTbDHCD();//遍历数据存储到集合中List<TbGoodsType> goodstype = new List<TbGoodsType>();while (dr.Read()){int id = dr.GetInt32(0);string typename = dr.GetString(1);int parentid = dr.GetInt32(2);TbGoodsType user = new TbGoodsType{ID = id,TypeName = typename,ParentID=parentid,};goodstype.Add(user);}dr.Close();return goodstype;}//二级菜单和三级菜单public static List<TbGoodsType> SelectDHCDz1(int typeid){SqlDataReader dr = TbIndexService.SelectTbDHCDz1(typeid);//遍历数据存储到集合中List<TbGoodsType> goodstype = new List<TbGoodsType>();while (dr.Read()){int id = dr.GetInt32(0);string typename = dr.GetString(1);int parentid = dr.GetInt32(2);TbGoodsType user = new TbGoodsType{ID = id,TypeName = typename,ParentID = parentid,};goodstype.Add(user);}dr.Close();return goodstype;}//四级菜单public static List<TbGoodsType> SelectTbDHCDSiJi(int typeid){SqlDataReader dr = TbIndexService.SelectTbDHCDSiJi(typeid);//遍历数据存储到集合中List<TbGoodsType> goodstype = new List<TbGoodsType>();while (dr.Read()){int id = dr.GetInt32(0);string typename = dr.GetString(1);int parentid = dr.GetInt32(2);TbGoodsType user = new TbGoodsType{ID = id,TypeName = typename,ParentID = parentid,};goodstype.Add(user);}dr.Close();return goodstype;}
三层架构中的DAL层中的代码：
//导航一级菜单public static SqlDataReader SelectTbDHCD(){//控制只能显示前十类string sql = \"select TOP 10 * from GoodsType where ParentID=0\";//调用连接查询return DBHelper.GetDataReader(sql);}//导航菜单二级和三级public static SqlDataReader SelectTbDHCDz1(int typeid){//控制只能显示前三类string sql = $\"select TOP 3 * from GoodsType where ParentID={typeid}\";//调用连接查询return DBHelper.GetDataReader(sql);}//导航菜单四级public static SqlDataReader SelectTbDHCDSiJi(int typeid){//控制只能显示前二十四类string sql = $\"select TOP 24 * from GoodsType where ParentID={typeid}\";//调用连接查询return DBHelper.GetDataReader(sql);}
好了，到此为止，主要代码就完成了，下面就需要加一些样式和js，控制一下页面的样式，使用栅格布局将展示的数据对其就完成啦，不懂的可以私信Little Monkey哦~。
感谢大佬指正 小Monkey
如果你觉得有用的话，就留个赞吧！蟹蟹
