我希望在每个页面中都有一个固定的导航栏,但是此布局正在更改使用此布局的其他页面的内容。是因为脚本吗?请尝试从基础进行解释。我已经包含了主页的屏幕截图。注册表缩小了。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - MY BOOKS</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
<li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
@*<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>*@
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts",false)
</body>
</html>
@model LogReg.Models.Login
<!DOCTYPE html>
<html>
<head>
<title>MyBooks Login Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<link href="/RegisterTemplate/css/font-awesome.min.css" rel="stylesheet" type="text/css" media="all">
<link href="/RegisterTemplate/css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="//fonts.googleapis.com/css?family=Raleway:400,500,600,700,800,900" rel="stylesheet">
</head>
<body>
<div class="signupform">
<h1>MyBooks Login Form</h1>
<div class="container">
<div class="agile_info">
<div class="w3l_form">
<div class="left_grid_info">
<h3>Welcome to MyBooks!</h3>
<h4>A place of Story makers, Dragon-tamers, Dream Catchers, Fact Finders and definitely a safer place.</h4>
<p>Books are the quietest and most constant of friends; they are the most accessible and wisest of counselors, and the most patient of teachers. </p>
</div>
</div>
<div class="w3_info">
<h2>Login to an Existing Account</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<form action="#" method="post">
<div class="input-group">
<span><i class="fa fa-user" aria-hidden="true"></i></span>
@Html.EditorFor(model => model.Email_ID, new
{
htmlAttributes = new
{
@class = "form-control",
@placeholder = "Enter Email Address",
required = "Required",
pattern = "[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,3}$",
title = "example@email.com"
}
})
@Html.ValidationMessageFor(model => model.Email_ID, "", new { @class = "text-danger" })
</div>
<div class="input-group">
<span><i class="fa fa-user" aria-hidden="true" ></i></span>
@Html.EditorFor(model => model.Password, new
{
htmlAttributes = new
{
@class = "form-control",
@placeholder = "Enter Password",
required = "Required",
oninvalid = "this.setCustomValidity('Password cannot be empty')",
oninput = "setCustomValidity('')"
}
})
@Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.Remember_Me)
@Html.ValidationMessageFor(model => model.Remember_Me, "Remember Me", new { @class = "text-danger" })
</div>
</div>
</div>
<button class="btn btn-danger btn-block" type="submit">Login</button>
</form>
}
</div>
<div class="clear"></div>
</div>
</div>
<div class="footer">
<p>© MyBooks Login form 2018. All Rights Reserved | Design by Aniket Prashar</p>
</div>
</div>
</body>
</html>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
答案 0 :(得分:1)
我强烈建议您阅读MVC tutorial或类似的内容,因为您尚不了解ASP.NET MVC的基本布局。
假设这是您的布局,则指示要使用此布局的每个页面都将具有此布局,并在@RenderBody()
上显示页面内容,这意味着您不应该在页面视图中重新加载脚本。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - MY BOOKS</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
<li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
@*<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>*@
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts",false)
</body>
</html>
控制器:
[HttpGet]
public ActionResult Homepage()
{
return View(new LogReg.Models.Login());
}
主页视图:
@{
ViewBag.Title= "MyBooks Login Page";
}
<link href="/RegisterTemplate/css/font-awesome.min.css" rel="stylesheet" type="text/css" media="all">
<link href="/RegisterTemplate/css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="//fonts.googleapis.com/css?family=Raleway:400,500,600,700,800,900" rel="stylesheet">
<div class="signupform">
<h1>MyBooks Login Form</h1>
<div class="container">
<div class="agile_info">
<div class="w3l_form">
<div class="left_grid_info">
<h3>Welcome to MyBooks!</h3>
<h4>A place of Story makers, Dragon-tamers, Dream Catchers, Fact Finders and definitely a safer place.</h4>
<p>Books are the quietest and most constant of friends; they are the most accessible and wisest of counselors, and the most patient of teachers. </p>
</div>
</div>
<div class="w3_info">
<h2>Login to an Existing Account</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<form action="#" method="post">
<div class="input-group">
<span><i class="fa fa-user" aria-hidden="true"></i></span>
@Html.EditorFor(model => model.Email_ID, new
{
htmlAttributes = new
{
@class = "form-control",
@placeholder = "Enter Email Address",
required = "Required",
pattern = "[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,3}$",
title = "example@email.com"
}
})
@Html.ValidationMessageFor(model => model.Email_ID, "", new { @class = "text-danger" })
</div>
<div class="input-group">
<span><i class="fa fa-user" aria-hidden="true" ></i></span>
@Html.EditorFor(model => model.Password, new
{
htmlAttributes = new
{
@class = "form-control",
@placeholder = "Enter Password",
required = "Required",
oninvalid = "this.setCustomValidity('Password cannot be empty')",
oninput = "setCustomValidity('')"
}
})
@Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
</div>
<div class="form-group">
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.Remember_Me)
@Html.ValidationMessageFor(model => model.Remember_Me, "Remember Me", new { @class = "text-danger" })
</div>
</div>
</div>
<button class="btn btn-danger btn-block" type="submit">Login</button>
</form>
}
</div>
<div class="clear"></div>
</div>
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
@section Scripts
将出现在布局视图内@RenderSection("scripts", required: false)
的位置,这意味着它不会在</div>
标签之后呈现。