Asp.net

如何在引導程序中使用 asp.net web.sitemap 和菜單控制項

  • July 10, 2020

我正在嘗試使用站點地圖和 asp.net 菜單控制項並使用引導程序對其進行皮膚。

我已經使用 ul 和 li 等完成了它,看起來很棒。但這並沒有增加麵包屑、角色等的靈活性,所以我想使用站點地圖和菜單控制項。任何人都得到任何幫助。我無法讓切換下拉等工作。我曾嘗試訪問後面程式碼中的項目以添加 css 和切換等,但它不會工作。

<asp:SiteMapDataSource ID="MenuSitemap" SiteMapProvider="MenuSitemap" runat="server"
ShowStartingNode="false"></asp:SiteMapDataSource>
<asp:Menu ID="menFrontEnd" runat="server" Orientation="Horizontal" DataSourceID="MenuSitemap"></asp:Menu>

站點地圖文件

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
   <siteMapNode url="/" title="Home"  description="Home">
     <siteMapNode url="/Default" title="Home"  description="Home" />
     <siteMapNode url="#1" title="Shop"  description="Shop">
       <siteMapNode url="/Secure/page1" title="page1"  description="page1" />
       <siteMapNode url="/Secure/page2" title="page2"  description="page2" />
     </siteMapNode>
     <siteMapNode url="#2" title="Maintenance"  description="Maintenance" >
       <siteMapNode url="/Secure/Maintenance/page1" title="page1"  description="Channels" />
       <siteMapNode url="/Secure/Maintenance/page2" title="page2"  description="page2" />
     </siteMapNode>
   </siteMapNode>
</siteMap>

謝謝大家

我在這里基於此程式碼和控制項實現了自己的控制項:

http://bootstrapfriendlywebcontrols.codeplex.com/SourceControl/latest#V1.0/NotAClue.Web.UI.BootstrapWebControls/BootstrapMenu.cs

看看Responsive ASP.NET Menu Control With Twitter Bootstrap

在本教程中,我們將使用 ASP.NET 菜單控制項和 Twitter Bootstrap 實現折疊響應式導航欄。

這是 jQuery 的相關部分,用於使菜單下拉菜單正確顯示。

   <script type="text/javascript">
       $(function () {           
           //to fix collapse mode width issue           
           $(".nav li,.nav li a,.nav li ul").removeAttr('style');  
           //for dropdown menu           
           $(".dropdown-menu").parent().removeClass().addClass('dropdown');           
           $(".dropdown>a").removeClass().addClass('dropdown-toggle').append('<b class="caret"></b>').attr('data-toggle', 'dropdown');            
           //remove default click redirect effect                      
           $('.dropdown-toggle').attr('onclick', '').off('click');
       });   
   </script>

請注意,.removeAttr('style')用於幫助折疊模式的選項會破壞Orientation="Horizontal"菜單上的屬性。我確信有辦法解決這個問題,但我還沒有弄清楚。

引用自:https://stackoverflow.com/questions/18724937