I am having trouble with accessing a html page that is in the same folder directory and level. Every thing I tried results in a error on the page. I have tried a few ways to navigate to the page, but all fail except for main 5 it just opens the login page again so that does not work either.
I am a bit lost on how this works. I have attached a picture of now my structure is set up below.
I am trying to get from home.html to main.html
I am running Spring framework.
And this is the code that I am using to as the link.
{{>partials/header}}
<h2>Login Page</h2>
<h4>Links</h4>
<ul class="nav nav-pills nav-stacked">
<li role="presentation">
Main 1
Main 2
Main 3
Main 4
Main 5
</li>
</ul>
{{>partials/footer}}
Here is my controller
//New login page
#RequestMapping(value = HOME_URL_MAPPING)
public String inventory(final Model model) {
return controllerHelper.createUrl(INVENTORY, WebGlobals.HOME);
}
//new page Was the home page before
#RequestMapping(value ="/main")
public String inventgus(final Model model) {
UserDetails activeUser = (UserDetails)SecurityContextHolder.getContext().getAuthentication().getPrincipal();
model.addAttribute(CAN_MAKE_REQUEST, canMakeRequest(activeUser));
model.addAttribute(CAN_APPROVE_REQUEST, canApproveRequest(activeUser));
return controllerHelper.createUrl(INVENTORY, "main");
}
You were so close! Here's the answer:
Main
The single dot refers to the current folder and putting a slash means that the file is under that folder.
this works for me:
Main
Related
I have created a layout component in the same directory as with the MainLayout component. The CustomLayout #inherits LayoutComponentBase and has #Body which gets the content to be rendered inside the layout.
As obviously expected, the layout component has its own css files and UI display is fine. I am only having a problem with the #onclick function. It cannot be invoked. Is there a way to trigger the function on button click?
The reason I want to do this is that I am creating a navigation bar which will have to show/hide a dropdown. I hope I can get some ideas on this. Appreciated.
I am calling a server function this way: #onclick="SomeFuction" or #onclick="SomeFuction" or #onclick="#(() => SomeFuction())"
LayoutComponent:
#inherits LayoutComponentBase
#Body
Home page referencing a custom layout:
[AllowAnonymous]
[Layout(typeof(CustomLayoutComponent))]
[AllowAnonymous] is just for allowing anonymous access.
I am using Blazor Server and .NET 6
Additional Information:
I have put all the code in one page so that it becomes easier to read and understand.
Here is the LayoutComponent razor component:
#inherits LayoutComponentBase
<div class="navbar" id="custom-navbar">
<div class="wrapper">
<a>Home</a>
<a>Service</a>
<button class="btn btn-primary" #onclick="ToggleProductsUI">Products</button>
</div> </div>
<!--Component to show Products UI Component. Scoped css for styling-->
<ProductsComponent TValue="string" UIState="#ProductsUIState"></ProductsComponent>
#code{
// state of the Products submenu Component
string ProductsUIState { get; set; }
// a control function for toggling the Products UI
// this function somehow is not invoked.
void ToggleProductsUI()
{
if (string.IsNullOrWhiteSpace(ProductsUIState))
{
ProductsUIState = "show-ui";
return;
}
ProductsUIState = string.Empty;
}
}
Here is the ProductsUI component code (I have removed the unnecessary event to avoid confusion. The component can be fully controlled by the parent):
public partial class ProductsComponent<TValue> {
[Parameter]
public string? UIState { get; set; } }
Blazor pages that will use the custom layout component will point to it like this:
[AllowAnonymous]
[Layout(typeof(CustomLayoutComponent))]
public partial class Index
{
}
This is working fine. The issue is in the CustomLayoutComponent when trying to invoke the ToggleProductsUI() function
I accidentally inluded a <body> element in the layout and as such, the <script src="_framework/blazor.server.js"></script> was not being run hence the click event was not being invoked. I removed the <body> element. I was misled by the default body{} style in the underlining scopped css. Resolved.
I have created an event in my header component and trying to listen it in app component, but it is not working as expected.
In header.component.html, on clicking on "Recipes" it is sending 'recipe' string to "onSelect()" method and on clicking on "Shopping List", it is sending string 'shopping-list' to "onSelect()" method.
<li> Recipes</li>
<li> Shopping List</li>
In header.component.ts , I have created event "featureSelected" which is emitting data, whatever we receive in "onSelect()" method.
#Output() featureSelected = new EventEmitter<string>();
onSelect(feature:string){
this.featureSelected.emit(feature);
}
Now, we are listing event "featureSelected" in app.component.html, if it emits string "recipe" we load, recipe component else we load "shopping-list" component.
<app-header> (featureSelected)="onNavigate($event)"</app-header>
<div class="container">
<div class="row">
<div class="col-md-12">
<app-recipes *ngIf="loadedFeature === 'recipe'"></app-recipes>
<app-shopping-list *ngIf="loadedFeature !== 'recipe'"></app-shopping-list>
</div>
</div>
</div>
app.component.ts
loadedFeature='recipe';
onNavigate(feature:string){
this.loadedFeature=feature;
}
It is not loading shopping-list component on clicking on "Shopping List". I think listener is not working properly even though code looks fine. Please help me in finding the issue and please let me know, if any additional information required.
<app-header> (featureSelected)="onNavigate($event)"</app-header>
First of all this is not correct. You need to have output method inside of app-header like this.
<app-header (featureSelected)="onNavigate($event)"> </app-header>
And with that you can access in the onNavigate($event) and store it to some property.
There is stackblitz with working example StackBlitzDemo
If this helps mark it as answer pls.
I have some trouble with logout on my page. i have a controller with this
public ActionResult LogOut()
{
FormsAuthentication.SignOut();
Session.Abandon();
return RedirectToAction("Index", "Home");
}
And so a view called LogOut. I've put an href on it with a button :
<li><a class="logout" href="~/Views/Account/LogOut.cshtml">Se déconnecter</a></li>
but when i click it keeps saying me your page couldn't been found etc...
But strange thing is this, if i put in my adress bar, the path to the LogOut view it works and i'm disconnected, someone knows why ?
You should give href like this instead of path to cshtml file:
<li><a class="logout" href="#Url.Action('Logout', 'ControllerName')">Se déconnecter</a></li>
it will hit LogOut Action Method then will Render your view Appropriately
You can set link in different way :
1) <li><a class="logout" href="/Account/LogOut">Se déconnecter</a></li>
2) <li><a class="logout" href="#Url.Action("LogOut","Account")">Se déconnecter</a></li>
3) <li>#Html.ActionLink("Se déconnecter", "Account", "Logout", new { #class="logout" })</li>
Currently in my view this is what I have
<dt>Credit Saldo</dt>
<dd>#Model.CreditSaldo #Html.ActionLink("Add Credit","AddCredit",routeValues:new{Model.LicenseId})</dd>
<br/>
<dd>
<div id="partialDiv"></div>
</dd>
Whenever User clicks Add Credit, currently it forwards me to new partial view (no surprise).
What I want to do is load that partial view in same view, in the div that has Id as partialdiv.
Here is the method in controller, thats being called when the link is called
[HttpGet]
public ActionResult AddCredit(Guid licenseid)
{
var newCredit = new AddCredits();
return PartialView(newCredit);
}
and this is what I've done in partial view
#model AdminPortal.Areas.Customer.Models.ViewModels.AddCredits
<div class="input-small">#Html.EditorFor(m=>m.CreditToAdd) <button class="btn-small" type="submit">Add</button></div>
How can I load the partial view in same view when the link "Add Credit" is clicked?
Edit 1 : Tried Ajax
<dt>Credit Saldo</dt>
<dd>#Model.CreditSaldo #Ajax.ActionLink("Add Credit","AddCredit",new{Model.LicenseId}, new AjaxOptions {UpdateTargetId = "partialDiv"})
<br/>
<dd>
<div id="partialDiv"></div>
</dd>
Result: Partial View still loads as new view (not in same view)
You can use the ajax helpers for that
#Ajax.ActionLink("Add Credit","AddCredit",routeValues:new{Model.LicenseId}, new AjaxOptions {UpdateTagetId = "partialDiv"}, new {})
In order for these to work, you will need to make sure that you load jquery and jquery.unobtrusive-ajax in your layout.
When including jquery, use a pre 1.9 version or the scripts won't work. If you need a version of jquery 1.9+ add the jquery.migrate package from nuget to your project and load that in your layout too.
I am having jquery tabs inside the parent menus, I want to retain the opened tabs after the page redirect.
HttpContext.Current.Response.Redirect("~/HRMS/PayrollHome.aspx", false);
You could always store when tabs are opened and closed in the session. Then when the page is visited again you can check if each tab is listed as being open in the session and if it is re-open it.
EDIT
Its difficult to give you entire code snippets that answer your problem completely because I haven't got access to your code base. But it would be something like this.
<ul id="tabs">
<li onclick="$.get("SaveTab.ashx?tab=1");">Tab 1</li>
<li onclick="$.get("SaveTab.ashx?tab=2");">Tab 2</li>
</ul>
Then in the SaveSession handler
<%# WebHandler Language="C#" Class="SaveTab" %>
using System;
using System.Web;
public class SaveTab: IHttpHandler, System.Web.SessionState.IRequiresSessionState
{
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
if (HttpContext.Current.Request.QueryString["tab"] != null)
{
HttpContext.Current.Session["OpenTab"] = HttpContext.Current.Request.QueryString["tab"];
}
}
public bool IsReusable {
get {
return false;
}
}
}
Then in the ASPX output some Javascript that selects the tab. Notice that I am outputting the session value.
$(document).ready(function() {
$('#tabs').tabs('select', <%= SESSION["OpenTab"]%>);
});
I hope this is enough for you to get the general idea, I can't obviously tell you exactly what to do just show you a good approach.