两个list怎么在页面上拼成树形菜单
0
悬赏园豆：80
[已解决问题]
解决于 2013-08-30 10:53
foreach (var item in Model)
{
<h5 class="title">@item.mName</h5>
<ul>
<li id="a">123</li>
<script type="text/javascript">
//对应模块菜单
$.ajax({
url:'@Url.Action("menu")',
type:'get',
data:{id:@item.mid},
success:function(data)
{
$.each(data,function(i,val)
{
$("#a").append(val.mName);
})
}
})
</script>
</ul>
}
代码中模块以及对应的菜单都显示出来了，但所有的菜单都跑到第一个模块<li>标签里去了，因为我用的是append所以当模块id显示为第二个的时候对应菜单仍然跑到第一个模块下面，求高手看下改怎么修改把模块跟菜单一一对应起来
最佳答案
0
首先按照你的思路写一个：
foreach (var item in Model) { <h5 class="title">@item.mName</h5> <ul> <li id="a">123</li> //在循环中用id，这种做法不可取，id需要唯一值。 <script type="text/javascript"> //对应模块菜单 $.ajax({ url:'@Url.Action("menu")', type:'get', data:{id:@item.mid}, success:function(data) { document.write("<ul>") $.each(data,function(i,val) { document.write("<li>"+val.mName+"</li>") }); document.write("</ul>"); } }) </script> </ul> }
收获园豆：80
建议：对于树形结构，数据库一般存储为（id,pid,name）。
那么直接全部查询出来，通过前台遍历才是最好是解决方式，参考代码如下：
foreach (var item in Model.Where(x=>x.Pid==0))//获取父节点 { <h5 class="title">@item.mName</h5> <ul> <li id="a">123</li> <ul> foreach(var child in Model.Where(x=>x.Pid==item.Id)) { <li>@child.Name</li> } </ul> </ul> }
@幻天芒: 你的思路是对的，用第二种最好。问题解决了，谢谢！
@老虎五只: 解决了就好~
其他回答(3)
0
$("#a") ？这个应该根据相应的foreach 的index来控制顺序
然后绑定的时候根据index来绑定、
0
认真看了，我也做过这个效果，我的理解是：一级菜单是绑定@item.mName，二级子菜单是根据@item.mid获取数据绑定mName。不知道是不是这个意思，如果是的话可以用两个foreach来绑定。
foreach (var item in Model)
{
<h5 class="title">@item.mName</h5>
<ul>
foreach(var item2 in getItem2(@item.mid)){
<li id="a">item2.mName</li>
}
</ul>
}
getItem2(@item.mid)是获取数据的方法。我就是用这种方法来做的。如果必须要用ajax来获取数据的话同样可以使用两个foreach的。
0
你的那个 ID 是死的，当然是加到第一个菜单上了。
最好一次行将所有的菜单都取回来。
