I am writing my first MVC 3 aplication (in ASP.NET) and I don't know how I can(should) display the menu for different users.
My app is created as MVC3 Web Application and the menu look like this:
<div id="menucontainer">
<ul id="menu">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Info", "Info", "Home")</li>
</ul>
</div>
I created two types of roles: user and admin. Now, I want to show another links for user(Projects, Profile) and for admin(Manage Projects, Manage Accounts, Manage news).
How I should do that?
I found solution:
<div id="menucontainer">
<ul id="menu">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Info", "Info", "Home")</li>
#if ( Request.IsAuthenticated && HttpContext.Current.User.IsInRole
( "user" ) ) {
<li>Projects link</li>
<li>Profile link</li>
}
#if ( Request.IsAuthenticated && HttpContext.Current.User.IsInRole
( "admin" ) ) {
<li>Manage Projects link</li>
<li>Manage Accounts link</li>
}
</ul>
</div>
Related
I switched from ASP.NET MVC to ASP.NET Core MVC, but how can I run this code in ASP.NET Core MVC. I'm waiting for your help
#helper CreateMenu(IEnumerable<Menuler> anamenu)
{foreach (Menuler rootcat in anamenu.OrderBy(x => x.Sira))
{
if (rootcat.AltMenuler.Count() > 0)
{
<li>
<a class="" href="#(rootcat.Url)">
#(rootcat.MenuAdi)
</a>
<ul class="dropdown-menu">
#CreateSubMenuItems(rootcat)
</ul>
</li> }
else
{
<li>
<a class="" href="#(rootcat.Url)"> #(rootcat.MenuAdi) </a>
</li>
}
}
#helper CreateSubMenuItems(Menuler menu)
{foreach (Menuler altmenu in menu.AltMenuler.OrderBy(x => x.Sira))
{
if (altmenu.AltMenuler.Count() > 0)
{
<li>
<a href="#(altmenu.Url)">
#(altmenu.MenuAdi)
</a>
#if (altmenu.AltMenuler.Count() > 0)
{
<ul>
#CreateSubMenuItems(altmenu)
</ul>}
</li> }
else
{
<li>
<a href="#(altmenu.Url)">
#(altmenu.MenuAdi)
</a>
</li>}
}
#CreateMenu(anamenu)
The #helper syntax can help declare/create a reusable helper method in ASP.NET Web Pages (Razor) website, but please note that the #helper syntax is not included in ASP.NET Core.
To create a reusable snippets of HTML in ASP.NET Core website, you can try to use partial views/pages, custom taghelpers or view components.
For more information, please check following docs:
Partial views
Custom tag helper
View components
I wanted to display navigation element as active (class nav-item active) when that element is clicked and the other elements with the non active class (nav-item). I am also using Thymeleaf layouts.
In the controller i have following code
#GetMapping("/login")
public String getLoginPage(Model model) {
model.addAttribute("activeLink", "Login");
return "login";
}
In the layout.html file (this file contains common header and footer for all pages), i have following code
<nav th:replace="navigation.html :: navibar(activeLink=${activeLink})"></nav>
In the navigation.html (this file only has navigation related code), i have code similar to
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top" th:fragment="navibar(activeLink)">
<a class="navbar-brand" href="/title">Title</a>
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
<li th:class="${#strings.equals(activeLink, 'Home')} ? 'nav-item active' : 'nav-item'"><a class="nav-link" href="/">Home<span class="sr-only">(current)</span></a></li>
<li th:class="${#strings.equals(activeLink, 'Register')} ? 'nav-item active' : 'nav-item'"><a class="nav-link" href="/register">Register</a></li>
<li th:class="${#strings.equals(activeLink, 'Login')} ? 'nav-item active' : 'nav-item'" sec:authorize="isAnonymous()"><a class="nav-link" th:href="#{/login}">Login <span class="sr-only">(current)</span></a></li>
<li class="nav-item active" sec:authorize="isAuthenticated()"><a class="nav-link" th:href="#{/logout}">Logout <span class="sr-only">(current)</span></a></li>
</ul>
</div>
In the template returned by the controller (login), I do not have any navigation links specific code.
The above code is working, but is there a better simpler way to active navigation items?
Also, if I use flash attributes
redirectAttributes.addFlashAttribute("activeLink", "Register");
in the controller, then the functionality doesn't work
To avoid adding the activeLink to the model you can pass the activeLink when you include the fragment.
Like:
<div th:replace="nagivation :: navibar('Login')"></div>
Btw. you can remove the .html after the layout name.
The gist of my problem is to change the menu of my website to show the logged in user and a logout button where there was a login button from the start.
I'm new to MVC and might be going about this all wrong. this is the menu I wish to alter, and you'll see what my idea was. in Forms I could easily access this from the code behind and make one of the two menu options non visible.
<ul id="menu">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Members", "About", "Home")</li>
<li>#Html.ActionLink("Schedule", "Contact", "Home")</li>
<li id="loginLink">#Html.ActionLink("Login", "Login", "Account")</li>
<li id="logoutLink">#Html.ActionLink("(" + Session["userName"].ToString() + ")" + "Logout", "Logout", "Account")</li>
</ul>
Why would you want to do View manipulation from the controller? I believe that View specific logic should sit in the View itself.
If you have authenticated the user, and set the authentication cookie, you could just do the following in your view:
<ul id="menu">
<li>#Html.ActionLink("Home", "Index", "Home")</li>
<li>#Html.ActionLink("Members", "About", "Home")</li>
<li>#Html.ActionLink("Schedule", "Contact", "Home")</li>
#if (User.Identity.IsAuthenticated)
{
<li id="LogoutLink">#Html.ActionLink(User.Identity.Name + "Log Out", "Logout", "Account")</li>
}
else
{
<li id="loginLink">#Html.ActionLink("Login", "Login", "Account")</li>
}
</ul>
Without knowing exactly how you authenticate your user, I cannot say for sure that this solution will suit your needs.
This example will return the LogoutLink List Item if the user is Authenticated, otherwise, it will return the LoginLink List Item if the user is not authenticated.
In case you are interested in using the ASP.NET Identity library for authentication, here is a blog with some brilliant examples, this has helped me a lot.
I'm working with the new jqwidgets-angular version, released just last month in September.
The gridtree is working great, but having trouble with the tree widget.
FYI: This is based on the angular-tree demo here: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/index.htm#demos/jqxangular/tree.htm
Here's the jsfiddle I'm working on, but cannot get tree to render here: tree widget
So two things:
1) Can someone help me get this jsfiddle working ?
2) Can someone help me get the jqx-tree to render using ng-repeat
Here's the code from that jsfiddle.
Just a straight ng-repeat inside a div (no tree widget). This is just for testing purposes:
<div ng-app="App" ng-controller="myController">
<div>
<ul>
<li ng-repeat="kriGroup in kriData">{{kriGroup.group}}</li>
</ul>
</div>
</div>
And here's the jqx-tree directive, which is NOT working in jsfiddle example :
<div ng-controller="myController">
<jqx-tree jqx-width="'300px'" jqx-height="'300px'">
<ul>
<li id='home'>Home</li>
<li item-expanded='true'>Solutions
<ul>
<li>Education</li>
<li>Financial services</li>
<li>Government</li>
<li>Manufacturing</li>
<li>Solutions
<ul>
<li>Consumer photo and video</li>
<li>Mobile</li>
<li>Rich Internet applications</li>
<li>Technical communication</li>
<li>Training and eLearning</li>
<li>Web conferencing</li>
</ul>
</li>
<li>All industries and solutions</li>
</ul>
</li>
<li>Products
<ul>
<li>PC products</li>
<li>Mobile products</li>
<li>All products</li>
</ul>
</li>
<li>Support
<ul>
<li>Support home</li>
<li>Customer Service</li>
<li>Knowledge base</li>
<li>Books</li>
<li>Training and certification</li>
<li>Support programs</li>
<li>Forums</li>
<li>Documentation</li>
<li>Updates</li>
</ul>
</li>
<li>Communities
<ul>
<li>Designers</li>
<li>Developers</li>
<li>Educators and students</li>
<li>Partners</li>
<li>By resource
<ul>
<li>Labs</li>
<li>TV</li>
<li>Forums</li>
<li>Exchange</li>
<li>Blogs</li>
<li>Experience Design</li>
</ul>
</li>
</ul>
</li>
<li>Company
<ul>
<li>About Us</li>
<li>Press</li>
<li>Investor Relations</li>
<li>Corporate Affairs</li>
<li>Careers</li>
<li>Showcase</li>
<li>Events</li>
<li>Contact Us</li>
<li>Become an affiliate</li>
</ul>
</li>
</ul>
</jqx-tree>
</div>
and finally the js controller code :
angular.module('App', ['jqwidgets'])
.controller('myController', function ($scope) {
$scope.kriData = [
{
"group": "99_HSVaR",
"kris": [
{
"kri": "1D"
},
{
"kri": "1D CR"
},
{
"kri": "1D EQ"
},
{
"kri": "1D EUR/USD"
}
]
},
{
"group": "Additive",
"kris": [
{
"kri": "MCS"
}
]
},
{
"group": "AsianCrisis",
"kris": [
{
"kri": "Stressed"
}
]
}
];
})
I found the solution, posted in this jsfiddle: http://jsfiddle.net/robertmazzo/s9snLu9m/3/
My ng-repeat was in the wrong scope. And in addition, there were some key attributes missing such as the jqx-data directive.
For example, as shown in the jsfiddle :
<div ng-app="App" ng-controller="myController">
<jqx-tree jqx-data="kriData" jqx-height="300">
<ul>
<li ng-repeat="kriGroup in data">{{kriGroup.group}}</li>
</ul>
</jqx-tree>
</div>
I am wondering why the following:
#if(Request.LogonUserIdentity.IsAnonymous){
<ul id="menu">
<li>#Html.ActionLink("Location", "Index", "Location")</li>
<li>#Html.ActionLink("Map", "Map", "Home")</li>
<li>#Html.ActionLink("Help", "Help", "Home")</li>
</ul>
#}else if(Request.LogonUserIdentity.IsAuthenticated){
<ul id="menu">
<li>#Html.ActionLink("Location", "Index", "Location")</li>
<li>#Html.ActionLink("Service", "Index", "Service")</li>
<li>#Html.ActionLink("Service Assignment", "Index", "ServiceAssignment")</li>
<li>#Html.ActionLink("Content Management", "Index", "Content")</li>
</ul>
#}
Is throwing the following error:
Description: An error occurred during the compilation of a resource
required to service this request. Please review the following specific
error details and modify your source code appropriately.
Compiler Error Message: CS1501: No overload for method 'Write' takes 0
arguments
This error is thrown on my else if block. I am new to ASP.net and razor, but from my understanding what I did is correct no? Since they both are Boolean returns.
I think you don't need the "#" in the else if.
Try like this:
#if(Request.LogonUserIdentity.IsAnonymous){
<ul id="menu">
<li>#Html.ActionLink("Location", "Index", "Location")</li>
<li>#Html.ActionLink("Map", "Map", "Home")</li>
<li>#Html.ActionLink("Help", "Help", "Home")</li>
</ul>
}else if(Request.LogonUserIdentity.IsAuthenticated){
<ul id="menu">
<li>#Html.ActionLink("Location", "Index", "Location")</li>
<li>#Html.ActionLink("Service", "Index", "Service")</li>
<li>#Html.ActionLink("Service Assignment", "Index", "ServiceAssignment")</li>
<li>#Html.ActionLink("Content Management", "Index", "Content")</li>
</ul>
}
Your razor syntax is goofed. You should surround the entire if/else if block with the #{} and remove the # symbol from the various closing braces in your if/else branch.
#{
if (Request.LogonUserIdentity.IsAnonymous)
{
<ul id="menu">
<li>#Html.ActionLink("Location", "Index", "Location")</li>
<li>#Html.ActionLink("Map", "Map", "Home")</li>
<li>#Html.ActionLink("Help", "Help", "Home")</li>
</ul>
}
else if (Request.LogonUserIdentity.IsAuthenticated)
{
<ul id="menu">
<li>#Html.ActionLink("Location", "Index", "Location")</li>
<li>#Html.ActionLink("Service", "Index", "Service")</li>
<li>#Html.ActionLink("Service Assignment", "Index", "ServiceAssignment")</li>
<li>#Html.ActionLink("Content Management", "Index", "Content")</li>
</ul>
}
}