我正在查看很多的教程,從web-forms
和.master
VS MVC主佈局。佈局和不同的內容和風格,複雜的MVC4應用程序
我遇到的問題是關於嵌入式全局文件與單個頁面自己的文件。
(文件=樣式和腳本)
邊記下了我的觀點我實現了一個小的命名慣例/規則,這樣的佈局,大師有一個LO
後綴, 所以如果我的應用程序名爲「SADMIN」,然後我的佈局(主)-chtml將被命名爲:_SAdminLO.cshtml
和我的佈局,主人,我有:
(爲簡單起見)只是一個主要的酒吧 - 鏈接(使所有的頁面有「鏈接「top-bar)
這是主要的佈局
[textlink1] | [textlink2] | [textlink3] | [textlink4] ....
然後我有索引頁(它的名字是的cPanel)
在我的索引cpanel.chtml
除了主要佈局的文字吧我添加了圖標...複製在 圖標菜單形式頂欄
[IMG] [IMG]
page_name page_name
[IMG] [IMG]
page_name page_name
所以一起佈局主_SAdminLO.cshtml
+ cpanel.chtml
- 320交織的「主頁」我的應用程序的
現在我有,是完全獨立於他們的行動
個人網頁,但他們需要的是最上面一欄的CSS + HTML,而不是cpanel
(索引)
所以我的情況即:在 rightclick->查看源代碼,我可以看到我所有的網頁具有雙重html標籤 -
<html> + <head> + <body> markup of `LO`
&
個<html> + <head> + <body> markup of `individual.cshtml `
文件:
-master-
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<link href='@Href("~/Content/css/GlobUtils.css")' rel='stylesheet' type='text/css' />
<title>@ViewBag.Title</title>
@Scripts.Render("~/js")// C# bundle
@RenderSection("head", false)
</head>
<body id="bodid">
<h2>Cpanel</h2>
<div id="navbar">
<ul id="nav">
<div class="menu-main-container">
<ul id="menu-main" class="menu">
<li id="menu-item-0" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-0 current_page_item menu-item-0">
@Html.ActionLink("Cpanel", "Cpanel", "ControlPanel")
</li>
<li id="menu-item-1" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-1 current_page_item menu-item-1">
@Html.ActionLink("Templates Generator", "TemplateGenerator", "ControlPanel")
</li>
<li id="menu-item-2" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-2 current_page_item menu-item-2">
@Html.ActionLink("Content Editor", "ContentEditor", "ControlPanel")
</li>
<li id="menu-item-3" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-3 current_page_item menu-item-2">
@Html.ActionLink("Files Uploader", "FilesUploader", "ControlPanel")
</li>
<li id="menu-item-4" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-4 current_page_item menu-item-2">
@Html.ActionLink("Code Dev", "CodeDev", "ControlPanel")
</li>
</ul>
</div>
</ul>
</div>
@RenderBody()
</body>
</html>
someindividualpage.chtml
@{
Layout = "~/Views/Shared/_EvProAdminLO.cshtml";
}
@model MvcE.Models.IndexModel.CreatedTemplateJPacket
<!DOCTYPE html>
@{
ViewBag.Title = "TemplateGenerator";
}
<html>
<head>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Template Generator</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
<script src="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.0/jquery-ui.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link href='@Href("~/Content/css/Chrm_TemplateGenerator.css")' rel="stylesheet" type="text/css" />
</head>
<body id="bodid">
<div id="DivEditor">
<h1 id="ContH"> ControlPanel - TemplateGenerator</h1>
<div class="container-fluid">
<div>
<a class="btn btn-CtrlsTmplt" id="save" href="#">save</a>
<a class="btn btn-CtrlsTmplt" id="load" href="#">load</a>
<a class="btn btn-CtrlsTmplt" id="clear" href="#">clear</a>
<input type="text" id="scr1" class="input_Border_AndBGClear" />
</div>
<hr/>
@*----------------------------------localData-------------------------------------*@
<div id="localData">
<input id="DataValue_FormFileds" type="hidden" />
</div>
</div>
</div>
<div id="SaveNewTmpltWwrap">
</div>
<script src='@Href("~/Js/jspart2.js")' type="text/javascript"></script>
</body>
因爲佈局和主視圖頁面都有標籤,所以您有雙''。將它從視圖頁面中移除,然後在自定義(並非必需)部分中包含可變頭部內容'@section myCustomSection {...}' – Jasen
@Jasen這個「individual.cshtml」視圖需要它自己的css + js調用,個人2也有...主佈局+索引 - 部分有其自己的,如果你可以發佈一個只有框架的代碼'Layoutfile' +它是'index'靈魂隊友'局部視圖'和'個人X的另一個' cshtml' –
您可以簡單地從除佈局以外的其他頁面中移除頭部和身體標籤,並使用部分來加載其自己的CSS和js文件 – ssilas777