How to create a navigation menu in dotnet application?

Asked
Active3 hr before
Viewed126 times

6 Answers

applicationnavigationcreate
90%

Creating ASP.NET Core Application using MVC Template ,In this article, I am going to discuss how to create Responsive Navigation Menus in ASP.NET Core Application using bootstrap and JQuery. Please read our previous article, where we discussed the Environment Tag Helper in ASP.NET Core Application., Creating ASP.NET Core Web Application ,Now run the application and see the navigation menus which should be responsive. In the next article, I am going to discuss Form Tag Helpers in ASP.NET Core Application. Here, in this article, I try to explain how to create Responsive Navigation Menus in ASP.NET Core Application using bootstrap with some examples.

.btn {
   width: 80 px;
}
load more v
88%

This tutorial series will teach you the basics of building an ASP.NET Web Forms application using ASP.NET 4.5 and Microsoft Visual Studio Express 2013 for Web. A Visual Studio 2013 project with C# source code is available to accompany this tutorial series.,The server programming language for code in the page, such as C#.,In this tutorial, you will change look and feel of the Wingtip Toys application by replacing the Bootstrap CSS files.,Save the Default.aspx page by selecting Save Default.aspx from the File menu.

At the top of the page in the @Page directive, change the Title attribute to "Welcome", as shown highlighted in yellow below.

< % @ Page Title = "Welcome"
Language = "C#"
MasterPageFile = "~/Site.Master"
AutoEventWireup = "true"
CodeBehind = "Default.aspx.cs"
Inherits = "WingtipToys._Default" % >
load more v
72%

On the side of the live site application's code, you need to retrieve page data based on the Show in menu flag, and then handle the menu's presentation, design, and behavior. This dynamic approach gives editors full control over the navigation menu items, without the need to adjust and redeploy the site's code.,You have coded the functionality behind the navigation menu. Let's put the code to use and add the menu to the site's layout.,In the previous step of this tutorial, you have implemented the functionality that retrieves page data from the database and displays it on the live site. In this step, you will code a dynamic menu that allows your content editors to manage the website's navigation.,Website navigation tends to change based on the site's current content and the requirements of its owner. The Navigation item feature of page types allows content editors to set the Show in menu flag for individual pages, and thus control which pages from the content tree appear in the navigation menu.

namespace MEDIOClinic.Models {
   public class MenuItemViewModel {
      // Defines the properties of the MenuItem view model
      public string MenuItemText {
         get;
         set;
      }
      public string MenuItemRelativeUrl {
         get;
         set;
      }
   }
}
load more v
65%

You want to create a navigation bar that lets you add or remove items without changing code so that you can reuse the navigation bar in multiple applications.,A DataList control configured to render a table with an ItemTemplate provides the flexibility in the display of the columns that is needed for customizing a navigation bar.,Create an XML document containing the items that will be displayed in the navigation bar, and then create a user control that uses the contents of the XML document to provide the required customization.,Loading the XML document used to define the navigation bar items into a DataSet makes for easy traversal of those items.

<?xml version="1.0" encoding="utf-8"?>
<NavBar>
   <Public>
      <ButtonLink>../ChapterMenu.aspx</ButtonLink>
      <ImageSrc>images/nav/button_nav_home_off.gif</ImageSrc>
      <AltText>Home</AltText>
   </Public>
   <Public>
      <ButtonLink>../ProblemMenu.aspx?Chapter=1</ButtonLink>
      <ImageSrc>images/nav/button_nav_datagrids_off.gif</ImageSrc>
      <AltText>Datagrids</AltText>
   </Public>
   <Public>
      <ButtonLink>../ProblemMenu.aspx?Chapter=2</ButtonLink>
      <ImageSrc>images/nav/button_nav_validation_off.gif</ImageSrc>
      <AltText>Validation</AltText>
   </Public>
   <Public>
      <ButtonLink>../ProblemMenu.aspx?Chapter=3</ButtonLink>
      <ImageSrc>images/nav/button_nav_forms_off.gif</ImageSrc>
      <AltText>Forms</AltText>
   </Public>
   <Public>
      <ButtonLink>../ProblemMenu.aspx?Chapter=4</ButtonLink>
      <ImageSrc>images/nav/button_nav_user_controls_off.gif</ImageSrc>
      <AltText>User Controls</AltText>
   </Public>
</NavBar>
load more v
75%

Meta Stack Overflow ,Stack Overflow en español,Stack Overflow em Português, Stack Overflow Public questions & answers

I have created a console application which have a menu that allow me to navigate between the menu items. I handle the navigation logic in this method:

public virtual void updateMenu() {
   switch (Console.ReadKey(true).Key) {
      case ConsoleKey.UpArrow: {
         if (cursor > 0) {
            cursor--;
            Console.Clear();
            drawWithHeader();
         }
      }
      break;
   case ConsoleKey.DownArrow: {
      if (cursor < (menuItemList.Count - 1)) {
         cursor++;
         Console.Clear();
         drawWithHeader();
      }
   }
   break;
   case ConsoleKey.Escape: {
      if (ParentMenu != null) {

         hideMenu();
      }
   }
   break;
   case ConsoleKey.Enter: {
      Console.Clear();
      drawHeader();
      Console.CursorVisible = true;
      menuItemList[cursor].Action();
      Console.CursorVisible = false;
      Console.Clear();
      drawWithHeader();
   }
   break;
   default: {
      // Unsuported key. Do nothing....
   }
   break;
   }
}
load more v
40%

Every application has a main menu to allow users to navigate to pages/screens of the application. Some applications may contain more than one menu in different sections of the UI.,When you run the application, you will see the menu items added to the main menu:,The application or the modules can add items to a menu, without knowing how the menu is rendered.,ABP Framework is a modular application development framework. Every module may need to add items to the menu.

Example: Add a CRM menu item with Customers and Orders sub menu items

using System.Threading.Tasks;
using MyProject.Localization;
using Volo.Abp.UI.Navigation;

namespace MyProject.Web.Menus
{
    public class MyProjectMenuContributor : IMenuContributor
    {
        public async Task ConfigureMenuAsync(MenuConfigurationContext context)
        {
            if (context.Menu.Name == StandardMenus.Main)
            {
                await ConfigureMainMenuAsync(context);
            }
        }

        private async Task ConfigureMainMenuAsync(MenuConfigurationContext context)
        {
            var l = context.GetLocalizer<MyProjectResource>();

            context.Menu.AddItem(
                new ApplicationMenuItem("MyProject.Crm", l["Menu:CRM"])
                    .AddItem(new ApplicationMenuItem(
                        name: "MyProject.Crm.Customers", 
                        displayName: l["Menu:Customers"], 
                        url: "/crm/customers")
                    ).AddItem(new ApplicationMenuItem(
                        name: "MyProject.Crm.Orders", 
                        displayName: l["Menu:Orders"],
                        url: "/crm/orders")
                     )
            );
        }
    }
}
load more v

Other "application-navigation" queries related to "How to create a navigation menu in dotnet application?"