admin管理员组文章数量:1026989
I want to make a POS software in ASP.NET Core MVC, as a beginner. I want to have a guideline for making a Login, Registration full page which will be separated from the header, footer, sidebar until the user is authenticated, and then the main page will come where the header, footer, sidebar will be available.
Basically we use the header, where we call the _LoginPartial.cshtml partial view for login and also registration and RenderBody() help us to render all the pages after authentication.
But I want to create a page like without header and footer like this until the user is not authenticated:
Then when any user is authenticated, he will gain access to header, footer and other navbar components, how to design in the _Layout partial view for this condition?
Views/Shared/_Layout.cshtml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>POS Software</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
<div class="container-xxl position-relative bg-white d-flex p-0">
@if (User.Identity.IsAuthenticated)
{
<!-- Sidebar Start -->
<!-- Sidebar End -->
<!-- Content Start -->
<!-- Navbar Start -->
<!-- Navbar End -->
@* Main Body Start *@
<div class="container-fluid pt-4 px-4">
<div class="row g-4">
<partial name="_Notification" />
@RenderBody()
</div>
</div>
@* Main Body End *@
<!-- Footer Start -->
<!-- Footer End -->
</div>
<!-- Content End -->
}
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
@await RenderSectionAsync("Scripts", required: false)
</body>
</html>
How to complete the logic for handling the views after authentication, a detailed explanation can help me a lot.
I want to make a POS software in ASP.NET Core MVC, as a beginner. I want to have a guideline for making a Login, Registration full page which will be separated from the header, footer, sidebar until the user is authenticated, and then the main page will come where the header, footer, sidebar will be available.
Basically we use the header, where we call the _LoginPartial.cshtml partial view for login and also registration and RenderBody() help us to render all the pages after authentication.
But I want to create a page like without header and footer like this until the user is not authenticated:
Then when any user is authenticated, he will gain access to header, footer and other navbar components, how to design in the _Layout partial view for this condition?
Views/Shared/_Layout.cshtml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>POS Software</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
<div class="container-xxl position-relative bg-white d-flex p-0">
@if (User.Identity.IsAuthenticated)
{
<!-- Sidebar Start -->
<!-- Sidebar End -->
<!-- Content Start -->
<!-- Navbar Start -->
<!-- Navbar End -->
@* Main Body Start *@
<div class="container-fluid pt-4 px-4">
<div class="row g-4">
<partial name="_Notification" />
@RenderBody()
</div>
</div>
@* Main Body End *@
<!-- Footer Start -->
<!-- Footer End -->
</div>
<!-- Content End -->
}
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
@await RenderSectionAsync("Scripts", required: false)
</body>
</html>
How to complete the logic for handling the views after authentication, a detailed explanation can help me a lot.
Share Improve this question edited Nov 16, 2024 at 20:49 marc_s 757k184 gold badges1.4k silver badges1.5k bronze badges asked Nov 16, 2024 at 17:45 Maruf HasnatMaruf Hasnat 972 silver badges4 bronze badges 3- Simply put @if(User.IsAuthenticated) around the footer and header sections. Or use different layout in login/registration pages – Liero Commented Nov 16, 2024 at 21:48
- I can but the design will become complicated, and I want that if someone click on Sign Up or Login button, the previous page content also will be gone and redirect to complete Login page, until Authentication. Can you give me the folder design pattern? – Maruf Hasnat Commented Nov 17, 2024 at 3:38
- Explore the built in asp core templates with authentification. Its all there. – Liero Commented Nov 17, 2024 at 7:50
1 Answer
Reset to default 0I suggest you could use area to create a new layout for this condition. You could create an areas folder and inside it creates a new account folder, then this view will use its own layout and inside the login method, you could redirect to previous link.
More details, you could refer to below codes:
Create a folder areas folder:
Account controller:
[Area("Account")]
public class AccountController : Controller
{
public IActionResult Index()
{
return View();
}
}
Layout:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"]</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
This is from layout
<div class="container">
@RenderBody()
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Index view:
@{
ViewData["Title"] = "Index";
Layout = "~/Areas/Account/Views/Shared/_Layout.cshtml";
}
<h1>Index</h1>
This is from Index
Modify the program.cs:
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
app.MapControllerRoute(
name: "areas",
pattern: "{area:exists}/{controller=Home}/{action=Index}/{id?}");
Result:
I want to make a POS software in ASP.NET Core MVC, as a beginner. I want to have a guideline for making a Login, Registration full page which will be separated from the header, footer, sidebar until the user is authenticated, and then the main page will come where the header, footer, sidebar will be available.
Basically we use the header, where we call the _LoginPartial.cshtml partial view for login and also registration and RenderBody() help us to render all the pages after authentication.
But I want to create a page like without header and footer like this until the user is not authenticated:
Then when any user is authenticated, he will gain access to header, footer and other navbar components, how to design in the _Layout partial view for this condition?
Views/Shared/_Layout.cshtml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>POS Software</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
<div class="container-xxl position-relative bg-white d-flex p-0">
@if (User.Identity.IsAuthenticated)
{
<!-- Sidebar Start -->
<!-- Sidebar End -->
<!-- Content Start -->
<!-- Navbar Start -->
<!-- Navbar End -->
@* Main Body Start *@
<div class="container-fluid pt-4 px-4">
<div class="row g-4">
<partial name="_Notification" />
@RenderBody()
</div>
</div>
@* Main Body End *@
<!-- Footer Start -->
<!-- Footer End -->
</div>
<!-- Content End -->
}
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
@await RenderSectionAsync("Scripts", required: false)
</body>
</html>
How to complete the logic for handling the views after authentication, a detailed explanation can help me a lot.
I want to make a POS software in ASP.NET Core MVC, as a beginner. I want to have a guideline for making a Login, Registration full page which will be separated from the header, footer, sidebar until the user is authenticated, and then the main page will come where the header, footer, sidebar will be available.
Basically we use the header, where we call the _LoginPartial.cshtml partial view for login and also registration and RenderBody() help us to render all the pages after authentication.
But I want to create a page like without header and footer like this until the user is not authenticated:
Then when any user is authenticated, he will gain access to header, footer and other navbar components, how to design in the _Layout partial view for this condition?
Views/Shared/_Layout.cshtml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>POS Software</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
<div class="container-xxl position-relative bg-white d-flex p-0">
@if (User.Identity.IsAuthenticated)
{
<!-- Sidebar Start -->
<!-- Sidebar End -->
<!-- Content Start -->
<!-- Navbar Start -->
<!-- Navbar End -->
@* Main Body Start *@
<div class="container-fluid pt-4 px-4">
<div class="row g-4">
<partial name="_Notification" />
@RenderBody()
</div>
</div>
@* Main Body End *@
<!-- Footer Start -->
<!-- Footer End -->
</div>
<!-- Content End -->
}
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
@await RenderSectionAsync("Scripts", required: false)
</body>
</html>
How to complete the logic for handling the views after authentication, a detailed explanation can help me a lot.
Share Improve this question edited Nov 16, 2024 at 20:49 marc_s 757k184 gold badges1.4k silver badges1.5k bronze badges asked Nov 16, 2024 at 17:45 Maruf HasnatMaruf Hasnat 972 silver badges4 bronze badges 3- Simply put @if(User.IsAuthenticated) around the footer and header sections. Or use different layout in login/registration pages – Liero Commented Nov 16, 2024 at 21:48
- I can but the design will become complicated, and I want that if someone click on Sign Up or Login button, the previous page content also will be gone and redirect to complete Login page, until Authentication. Can you give me the folder design pattern? – Maruf Hasnat Commented Nov 17, 2024 at 3:38
- Explore the built in asp core templates with authentification. Its all there. – Liero Commented Nov 17, 2024 at 7:50
1 Answer
Reset to default 0I suggest you could use area to create a new layout for this condition. You could create an areas folder and inside it creates a new account folder, then this view will use its own layout and inside the login method, you could redirect to previous link.
More details, you could refer to below codes:
Create a folder areas folder:
Account controller:
[Area("Account")]
public class AccountController : Controller
{
public IActionResult Index()
{
return View();
}
}
Layout:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"]</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
</head>
<body>
This is from layout
<div class="container">
@RenderBody()
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Index view:
@{
ViewData["Title"] = "Index";
Layout = "~/Areas/Account/Views/Shared/_Layout.cshtml";
}
<h1>Index</h1>
This is from Index
Modify the program.cs:
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
app.MapControllerRoute(
name: "areas",
pattern: "{area:exists}/{controller=Home}/{action=Index}/{id?}");
Result:
本文标签：
版权声明：本文标题：c# - How to create a separate Login and Registration full Page without the header, footer part until authentication in ASP.NET C 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745648470a2161167.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论