RubyonRails导航菜单自动生成的方法

最近在做的一个ROR的web项目中遇到如下问题:

站在用户的角度思考问题,与客户深入沟通,找到潮州网站设计与潮州网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:成都网站建设、网站建设、企业官网、英文网站、手机端网站、网站推广、申请域名、网络空间、企业邮箱。业务覆盖潮州地区。

产品可以按类分类导航浏览,主要可以分为A,B,C三类,三类之下还有其他分类,同时,基类和其下的分类都可以由用户扩展。从横向上,主类可以由用户扩展,纵向上,用户也可以扩展。

类别信息存储与categories表中:

id:integer         主键

name:string        类别名称

parentid:integer   类别的父类

要求:

生成导航菜单,并且可以含有子类的菜单可以通过点击展开或关闭,并且可以按类别导航产品。

实现Ruby on Rails导航菜单:

通过深度优先遍历来生成菜单,在便利过程中构建菜单的html编码,主要是使用了一个@htmlmenu的string来拼接生成的html代码,最终显示在页面中。

Ruby on Rails导航菜单代码:

 
 
 
  1. def index
  2.     @htmlmenu=""
  3.     @htmlmenu+= "< ul>"
  4.     @root = Category.find(:all,:conditions=>['parentid=0'])
  5.     @root.each { |item|
  6.     if Category.find_by_parentid(item.id)
  7.     @htmlmenu+= "< li>< a href='#ChildMenu#{item.id}' onclick=\"DoMenu('ChildMenu#{item.id}')\">"
  8.     else
  9.       @htmlmenu+= "< li>< a href='/categories/#{item.id}'>"
  10.     end
  11.     @htmlmenu+= item.name
  12.     @htmlmenu+= "< /a>"
  13.     buildmenu item
  14.     @htmlmenu+= "< /li>"
  15.     }
  16.     @htmlmenu+= "< /ul>"
  17.   end
  18.   private
  19.   def buildmenu category
  20.     @children = Category.find_all_by_parentid(category.id)
  21.     if @children.size!=0
  22.       @htmlmenu+= "< ul id='ChildMenu#{category.id}' class='collapsed'>"
  23.       @children.each { |item|
  24.         if Category.find_all_by_parentid(item.id).size!=0
  25.           @htmlmenu+= "< li>< a href='#ChildMenu#{item.id}' onclick=\"DoMenu('ChildMenu#{item.id}')\">"
  26.         else
  27.                 @htmlmenu+= "< li>< a href='/categories/#{item.id}'>"
  28.         end
  29.         @htmlmenu+= item.name
  30.         @htmlmenu+= "< /a>"
  31.         buildmenu item
  32.         @htmlmenu+= "< /li>"
  33.         }
  34.       @htmlmenu+= "< /ul>"
  35.     end
  36.     
  37.   end

遍历方法为private的buildmenu方法。

说明:parentid=0是为了找到所有的基类,他们的parentid默认为0;

在代码中需要加入css和js:

 
 
 
  1. < script type="text/javascript">
  2. function DoMenu(emid){
  3.     var obj = document.getElementById(emid);
  4.     obj.className = (obj.className.toLowerCase() == "expanded"?"collapsed":"expanded");
  5.  
  6. }
  7. -->
  8. < /script>
  9. < style>
  10.  ul.collapsed {
  11.  display: none;
  12. }
  13. < /style>

有关Ruby on Rails导航菜单的补充:

1.这是一个雏形,关于性能问题有以下几点:

1.1  代码可以优化,有些比较判断没有必要,懒得去掉了:)

1.2  如果类别数据增多,如果担心过多的数据库访问,可以把这些写到程序初始化里去,不过缺点是新增的类别需要重启服务器后可以生效

2.我觉得这个拿去做文件系统遍历很好,而且可以直接生成html页面~

本文名称:RubyonRails导航菜单自动生成的方法
本文地址:http://www.mswzjz.cn/qtweb/news2/273802.html

攀枝花网站建设、攀枝花网站运维推广公司-贝锐智能,是专注品牌与效果的网络营销公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 贝锐智能