How can I include _Layout.cshtml in Razor Content Page ?
For example I created two cshtml files in root of my project.
First file is _Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<h1>Main Layout</h1>
<br>
<br>
#RenderBody();
</body>
</html>
Second File is Product.cshtml
#inherits ServiceStack.Razor.ViewPage
#{
Layout = "~/_Layout.cshtml";
}
<h1>Product Page</h1>
When I call http://localhost:6000/product
The result is in browser is
Product Page
but it should be
Main Layout
Product Page
Why ?
What's the problem ?
Layout names should be the name of the file not a path and you should never need to reference _Layout as it's the default.
Also if you want your Views and Content Pages to share the same _Layout.cshtml pages add them once to /Views/_Layout.cshtml or /Views/Shared/_Layout.cshtml instead.
If this is Self hosting HttpListener project you need to ensure all *.cshtml are set to Copy to Output Directory or the WebHostPhysicalPath references your project path.
Related
I'm using Razor with emails templates in .NET core 3.
While I can get this all to works, I'd like to change my templates file (called EmailLayout.cshtml and located at /Pages/Shared/) as an Embedded resource.
Whenever I do that in VS, I got this error:
InvalidOperationException: The layout view 'EmailLayout' could not be
located. The following locations were searched:
/Views/EmailLayout.cshtml /Views/Shared/EmailLayout.cshtml
/Pages/Shared/EmailLayout.cshtml
Why my file couldn't be found?
What should I add to get this to work?
Finally found the answer.
1) Install Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation nuget package
2) Add this to configuration in Startup :
services.Configure<MvcRazorRuntimeCompilationOptions>(options => {
options.FileProviders.Clear();
options.FileProviders.Add(new EmbeddedFileProvider(appDirectory));
});
3) Change the service to services.AddRazorPages().AddRazorRuntimeCompilation();
Make sure that the Build Action of the file is set to Content in the properties of the View.
You could follow the steps to use EmailLayout.cshtml:
1.Create Layout View:
2.Be sure it is in /Pages/Shared folder:
3.EmailLayout should be like:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
</head>
<body>
<h2>EmailLayout</h2>
<div>
#RenderBody()
</div>
</body>
</html>
4.Add the following code to your Razor Pages or _ViewStart.cshtml:
#{
Layout = "EmailLayout";
}
I am having two web pages default.aspx and main.aspx. How to show main.aspx content in default.aspx. i need to embed the content in one part of the default.aspx
You shoud change Main.aspx to a usercontrol(.ascx) then you can include it like this
<%# Register TagPrefix="uc" TagName="Main" Src="~/Controls/Main.ascx" %>
<uc:Main id="main" runat="server" />
I believe you want to embed the content in an iframe.
So in default.apx, you should embed:
<iframe src="http://www.main.aspx"></iframe>
Using JQuery
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Load remote content into object element</title>
</head>
<body>
<div id="siteloader"></div>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$("#siteloader").html('<object data="http://tired.com/">');
</script>
</body>
</html>
For more reference
You have some choices here:
1. Use iframe HTML tag
2. Use UserControl (.ascx)
3. Use MasterPage
I downloaded a free template and I want to use it for my web site (using c# in Visual Studio 2010). I put inside the tag, but it shows me only one color, without the images. I put image folder, style.css file and index.html in the same hierarchy in the project.
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Pocetna.aspx.cs" Inherits="Pocetna" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">;
<html xmlns="w3.org/1999/xhtml">;
<head runat="server">
<title>Добродојдовте</title>
<link rel="stylesheet" type="text/css" href="~/style.css" />
</head>
<body>
<form id="form1" runat="server"> </form>
</body>
</html>
CSS which you have copied is having relative path for images.
You will be required to either change paths to absolute path or needs to copy images from remote place(from where you have copied css) and put it into required place in local directory
do you use firefox or chrome? Use the web developer tool to see that your page is really saying. Then you may get the idea where is the error happening.
I have asp.net mvc application, that uses razor view engine.
I want to send head to browser, before body renders, to start parallel loading css, js and images, linked in css. (You can see, how this technique works on SO in chrome developer tools - network for example)
I found question about it in asp.net web forms: Send head before body to load CSS and JS asap
I tried to use this solution, but it don't work.
For razor engine next sequense of steps is actual:
action returns view result
_ViewStart.cshtml executes (set ViewBag.Layout)
view executes from first line to last (with code inclusions and sections)
view engine checks ViewBag.Layout and if it found - executes Layout (with renderind body and sections)
I think that good solution is to divide step 3 into 3 parts:
generating content for Head and Css section
send to browser
generating other part of view
Other solution is to static include all.css and basic .js files in (without sections content, generated from view), send head, and then generate view (with generation FooterScript section).
In both ways I need to start execution from Layout page, not from view. For first: Layout (head) - view (sections) - layout (flush) - view (other) - layout (body). For second: Layout (head + flush) - view (all) + Layout (body).
My _Layout.cshtml file:
<html #Html.Raw(ViewBag.xmlns)>
<head>
<title>#ViewBag.Title</title>
#Html.Partial("_MetaTags")
<link href="#Url.ThemeCss("jquery-ui-1.8.18.custom.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Css("masterPage.css")" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="/favicon.ico"/>
#RenderSection("Css", required: false)
<script src="#Url.CommonScript("jquery.common.min.js")" type="text/javascript"></script>
<script src="#Url.Script("Master.js")" type="text/javascript"></script>
#RenderSection("Head", required: false)
</head>
<body>
<div id="pageWhithoutFooter">
<div id="main">
#RenderBody()
</div>
</div>
#RenderSection("FooterScript", required: false)
</body>
</html>
Howto?
Try putting your head section into a Partial view then call this in your controller:
PartialView("_PageHeader").ExecuteResult(ControllerContext);
Response.Flush();
// Generate model
return View(model);
Not tested this but I can't see why it wouldn't work.
This is my first time trying to make a login page. What I want to be able to do is take an existing html and put the login control on that page. I realize I can't take the html and drop asp controls on to it. My question is how do I use the existing HTML layout as the template for my new aspx page?
1) Get the source for the existing page ( View in a browser -> Right Click-> View source -> Select All -> Copy)
2) Create a new aspx page; delete everything after the <%# Page %> directive
3) Paste your HTML source from the HTML page.
4) Switch to design view of the aspx page, and delete whatever you dont need, add your login controls.
Create an empty asp.net project and then copy the HTML into the new page and modify it to work with the controls you are dropping into it.
If you want to persist a layout across multiple pages and I'm not sure that's what you are looking for, then the best thing to do is to store the html for layout in a master page.
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="HeaderContent" runat="server"></asp:ContentPlaceHolder>
</head>
<body>
<div id="wrapper">
<div id="header">//add in html to setup your header</div>
<div id="content"><asp:ContnetPlaceHolder ID="Content"></asp:ContentPlaceHolder></div>
<div id="footer">//add in html to setup the footer</div>
</div>
</body>
</html>