Ruby on Rails导航菜单自动生成的方法

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

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

类别信息存储与categories表中:

id:integer         主键

name:string        类别名称

parentid:integer   类别的父类

要求:

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

实现Ruby on Rails导航菜单:

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

Ruby on Rails导航菜单代码:

def index  



    @htmlmenu="" 




    @htmlmenu+= "< ul>" 




    @root = Category.find(:all,:conditions=>['parentid=0'])  




    @root.each { |item|  




    if Category.find_by_parentid(item.id)  




    @htmlmenu+= "< li>< a href='#ChildMenu#{item.id}' onclick=\"DoMenu('ChildMenu#{item.id}')\">" 




    else 




      @htmlmenu+= "< li>< a href='/categories/#{item.id}'>" 




    end 




    @htmlmenu+= item.name  




    @htmlmenu+= "< /a>" 



    buildmenu item  



    @htmlmenu+= "< /li>" 



    }  



    @htmlmenu+= "< /ul>" 




  end 



  private  



  def buildmenu category  




    @children = Category.find_all_by_parentid(category.id)  




    if @children.size!=0  




      @htmlmenu+= "< ul id='ChildMenu#{category.id}' class='collapsed'>" 




      @children.each { |item|  




        if Category.find_all_by_parentid(item.id).size!=0  




          @htmlmenu+= "< li>< a href='#ChildMenu#{item.id}' onclick=\"DoMenu('ChildMenu#{item.id}')\">" 




        else 




                @htmlmenu+= "< li>< a href='/categories/#{item.id}'>" 




        end 



 



        @htmlmenu+= item.name  




        @htmlmenu+= "< /a>" 



        buildmenu item  



        @htmlmenu+= "< /li>" 



        }  



      @htmlmenu+= "< /ul>" 



 



    end 



      



  end 

遍历方法为private的buildmenu方法。

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

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

< script type="text/javascript"> 


 


 


function DoMenu(emid){  



    var obj = document.getElementById(emid);  




    obj.className = (obj.className.toLowerCase() == "expanded"?"collapsed":"expanded");  



   


}  



--> 




< /script> 




< style> 



 ul.collapsed {  


 display: none;  


}  



< /style> 

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

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

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

相关推荐