2011-09-06 100 views
3

我有三個幀(橫幅,菜單,內容)的Web應用程序 菜單幀需要有一個動態滾動式菜單 示例:Django的捲起(可摺疊)菜單

+ Teachers 
    - Create 
    - Edit 
    - Delete 

+ Schools 
    - Create 
    - Edit 
    - Delete 
    - View Staff 

+ Classrooms 
    - Create 
    - Edit 
    - Delete 

如果你點擊+或「學校」它會隱藏/取消隱藏它下面的項目。 菜單需要在用戶登錄後根據用戶組和角色動態繪製。 有些用戶可能只被授權查看

+ Classrooms 
    -Edit 

,有些用戶將看到的一切。

是否有任何內容或任何人使用過的插件會提供我需要的框架?

+1

滾動菜單(這是由JS做了不Django的)或用於管理和渲染菜單? –

回答

6

簡單實現使用jQuery:

<div id="menu"> 
    <a>Teachers</a><br /> 
    <div style="display: none"> 
     <a href="">Edit</a><br /> 
     <a href="">Delete</a><br /> 
    </div> 
    <a>Schools</a><br /> 
    <div style="display: none"> 
     <a href="">Edit</a><br /> 
     <a href="">Delete</a><br /> 
    </div> 
</div> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$('#menu > a').click(function(){ 
    $(this).next().next().slideToggle(); 
    return false; 
}); 
</script> 
+2

'$(this).next()。next()' - 不要忘了'
':) –

+0

Thanks @Adam Jurczyk :) – Ski