2016-03-15 71 views
1

這是我的主佈局頁面。我正在生成動態菜單,但單擊下拉列表不會顯示任何項目。我究竟做錯了什麼?Umbraco Cms的下拉菜單

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage<ContentModels.Master> 
@using ContentModels = Umbraco.Web.PublishedContentModels; 
@{ 
    Layout = null; 
} 
<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>@Umbraco.Field("siteTitle")</title> 
     <meta name="description" content="@Umbraco.Field("metaDescription", recursive: true)"> 
     <meta name="keyword" content="@Umbraco.Field("metaKeywords", recursive: true)"> 
     <link href="~/Content/bootstrap.css" rel="stylesheet" /> 

      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    </head> 
    <body> 

這是導航部分的開始部分。

<nav class="navbar navbar-default"> 
    <div class="container-fluid"> 
    <!-- Brand and toggle get grouped for better mobile display --> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
    </div> 
    <!-- Collect the nav links, forms, and other content for toggling --> 
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
     @{ IPublishedContent root = Model.Content.AncestorOrSelf(1); } 
     <ul class="nav navbar-nav">  
     <li class="@((Model.Content.Name == root.Name) ? "active" : null)"> 
      <a href="/">@root.Name</a></li> 
     </li> 
     @foreach (IPublishedContent menuItem in root.Children.Where(x => x.IsVisible())) { 
      <li class="@((menuItem.Name == Model.Content.Name) ? "active" : null)"> 
       <a href="@menuItem.Url">@menuItem.Name</a> 
      </li> 
     } 

這是代碼開始不起作用的地方。

 <li class="dropdown"> 
      <a class="dropdown-toggle" data-toggle="dropdown" href='@Model.Content.AncestorOrSelf(1).Children.Where(x => x.DocumentTypeAlias == "projectsMain")'>Our Proj<span class="caret"></span></a> 
      <ul class="dropdown-menu"> 
      @{ 
       IQueryable projectsDropdown = 
       Model.Content.AncestorOrSelf(1) 
       .Children 
       .Where(x => x.DocumentTypeAlias == "projectsMain") 
       .First() 
       .Children 
       .Where("Visible") 
       .OrderBy("Name"); 

      } 
      @foreach(IPublishedContent project in projectsDropdown){ 
           var prevalue = project.GetPropertyValue<int>("projectStatus"); 
           if(Umbraco.GetPreValueAsString(prevalue) == "Completed"){ 
            <li><a href="@project.Url">@project.Name</a></li> 
           } 
          } 
      </ul> 
     </li> 
     </ul> 
    </div><!-- /.navbar-collapse --> 
    </div><!-- /.container-fluid --> 
</nav> 

     @RenderBody(); 

     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
     <!-- Include all compiled plugins (below), or include individual files as needed --> 
     <script src="~/Scripts/bootstrap.js"></script> 
     <script src="~/Scripts/bootstrap.min.js"></script> 
     <script src="~/Scripts/jquery-2.2.0.min.js"></script> 
    </body> 
</html> 

回答

1

你試過調試嗎?你是否檢查過生成的HTML源代碼,看看下拉菜單中是否有實際的項目ul?

您使用的是哪種Umbraco版本?看起來像7.x - 所以有更簡單的方法來做你做的一些事情。像@ CurrentPage.Site()來獲得根節點。

你正在包括bootstrap.js和bootstrap.min.js,這可能會搞砸了,還包括看起來像兩個版本的jQuery?

另外,您在bootstrap.js之後包含(jquery-2.2.0.js)jQuery,這可能也會導致問題。

+0

感謝您的幫助,它是導致問題的bootstrap和jquery文件! – RidiculousRob

+0

沒問題,很高興幫助:-) –