首页 新闻 搜索 专区 学院

两个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显示为第二个的时候对应菜单仍然跑到第一个模块下面,求高手看下改怎么修改把模块跟菜单一一对应起来

老虎五只的主页 老虎五只 | 初学一级 | 园豆:114
提问于:2013-08-29 16:53
< >
分享
最佳答案
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
幻天芒 | 高人七级 |园豆:36594 | 2013-08-29 18:39

建议:对于树形结构,数据库一般存储为(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>
 }
幻天芒 | 园豆:36594 (高人七级) | 2013-08-29 18:43

@幻天芒: 你的思路是对的,用第二种最好。问题解决了,谢谢!

老虎五只 | 园豆:114 (初学一级) | 2013-08-30 10:52

@老虎五只: 解决了就好~

幻天芒 | 园豆:36594 (高人七级) | 2013-08-30 11:10
其他回答(3)
0

   $("#a") ?这个应该根据相应的foreach 的index来控制顺序

 

然后绑定的时候根据index来绑定、

Beyond-bit | 园豆:2804 (老鸟四级) | 2013-08-29 16:58
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的。

|WinKi| | 园豆:669 (小虾三级) | 2013-08-29 17:27
0

你的那个 ID 是死的,当然是加到第一个菜单上了。

最好一次行将所有的菜单都取回来。

jone_e | 园豆:1410 (小虾三级) | 2013-08-29 18:12
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册