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>
Related
I have one master page and several content pages , I need to put a form tag inside a master page to handle sending data from my html elements and do this for my content pages as well .but I need to understand what is the best way to structure for such this scenario and what would be the effect of form tag of master page on content pages ? is it possible to put form tag in content pages when the master page has this tag inside itself ? I appreciate if I have in detail explanation ?
The <form runat="server"> element lives in the master page by default when you add a new one to your project; all child pages are implemented using ContentPlaceHolders.
For example, the master page: -
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
You can have as many ContentPlaceHolders as you need (often only one is needed though). If you then add a "child page using master page", the page-specific content is added inside the relevant <asp:Content> element - these are added by default once you have specified the master page to use when adding a "child page using master page": -
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<!-- your markup, controls etc.. -->
</asp:Content>
Have a read of the MSDN docs for more - http://msdn.microsoft.com/en-us/library/aa581781.aspx
I would like to know how to create an ASP.NET user control that allows for inner content (and how to render the inner content.
As a very simple example, let's say we're creating a control to create a div, so the control would be used as follows:
<%# Page Language="C#" %>
<%# Register TagPrefix="custom" TagName="MyDiv"
Src="~\Controls\MyDiv.ascx" %>
<html>
<head />
<body>
<custom:MyDiv id="Div1" runat="server">
... customizable content here ...
</custom:MyDiv>
</body>
<html>
The control should be agnostic to its inner content - i.e. any asp.net content can be added and will be rendered as per usual, and then surrounded with <div> and </div> tags.
(Note: I'm obviously not trying to make a control to simulate div tags, it's just a simple example.)
It's an interesting question. Before I suggest an answer, I think you should look into Master Pages: http://www.asp.net/web-forms/tutorials/master-pages
If that doesn't provide your solution, and you want to stick with the User Control route, it won't work the way you want to do it.
I have a master page and two content pages that uses the master page for layout and design. I have 2 css files for my master page. Now what I want to do is that when I run first content page master page uses the first css file and when I run the second content page it uses the other one. Any suggestions about how should I do this .
First off, this should not be your normal approach unless you are doing something unusual. The whole point of using a common master page is so that you can easily have a common look and feel across your website.
But you can do it a few ways. One way would be to put a placeholder in your master pages <head> section. Then create content for that placeholder in each content page that includes the appropriate css file.
You can use a ContentPlaceHolder in the master page, and inside the head to change the css differently on every next page, or just ignore it to keep some default.
Here is an example:
<head runat="server">
<asp:ContentPlaceHolder ID="styleHolder" runat="server" >
<link rel="stylesheet" type="text/css" href="default.css">
</asp:ContentPlaceHolder>
</head>
<body>
and inside on the page with the different css, just include the the PlaceHolder and change it.
How can I include pages, style sheets, or links to them, automatically into my ASP VBscript pages? I read something about 'global' pages, but I am unsure what they mean and how it is that I can accomplish such a thing. I'm sure this is an easy question, but it's of great help to me as I've been writing VBscript for 2 days now! I'm not exactly an expert on HTML in general either, but I feel I have a reasonably good grasp of things. I would appreciate a good detailed example of how a 'global' page plays with my other ASP pages.
I'm setting up my first site...a management site for the main site I intend to build afterward. I want to get all my ducks in a row before moving forward with the public site. Can someone please give me some detailed information on how to include these pages/links automatically (page includes(header/footer), style sheets, etc) globally throughout my site without the need of using <!--#include file.... on each page I make, because that is kind of a pain and I'm sure there is an easier way. If there is, I know you can help! Thanks in advance, I look forward to hearing what options/possibilities are available.
If you insist on using ASP Classic you may find some method for handling masterpage like functionality but it is, to the best of my knowledge, not suppoerted as such by the framework.
[Edit] Given the edit of the original question the method first demonstrated is not so interesting, hence I suggest an alternative method too.
You could make a general ASP-page which serves all traffic to the site. A queryparameter then specifies which subpage should be displayed. Subpages are made as seperate ASP-pages which are executed by the general/master page or by another subpage. A very crude example of this could look like this:
<%
url = Request.QueryString("url") & ""
if url = "/" or url = "" then
subpage = "home.asp"
else
subpage = url & ".asp"
end if
%>
<!DOCTYPE html>
<html>
<head>
<title>Header for all pages</title>
<link rel="stylesheet" href="/css/site.css" />
</head>
<body>
<% Server.Execute(subpage) %>
</body>
</html>
The site should then be addressed in this fashion:
www.domain.com/default.asp?url=/contact
which would load the contact.asp subpage into the masterpage or:
www.domain.com/default.asp?url=/user/1234/profile
to load a user's profilepage (displayed by the profile.asp in the folder user/1234). This last example raises some issues because then every user has to have a folder containing all the asp-files (which is far from optimal) so you might want to employ some interpretation of the url queryparameter to redirect input in a more intelligent way.
Another issue is the fact that subpages are ASP-pages themselves which means someone could reference them directly. This calls for some action to protect those subpages from direct reference. It can be done but this would probably mean including some code => back to square one!
Another disadvantages of this approach is that subpages are rendered in their own context and hence can't access functionality and data from the calling page's context. This means that global data has to be shared in some other way (session, application, database or some other way). Data can't be passed to the subpage either (and no, Server.Execute doesn't allow query-parameters).
The include-way
Personally I think you get the most flexibility by using header/footer includes as demonstrated in my original post and shown below.
One way is to put your general stuff in includes and then includes those bits on each ASP-page. E.g.:
<!-- #include virtual="/includes/header.asp" -->
content goes here
<!-- #include virtual="/includes/footer.asp" -->
And your header.asp could look something like this:
<!DOCTYPE html>
<html>
<head>
<title>Header for all pages</title>
<link rel="stylesheet" href="/css/site.css" />
</head>
<body>
and footer.asp like so:
</body>
</html>
This strategy has some disadvantages. The header is fairly static which could present some problems with SEO; For one the title should fit the pagecontent which is hard to accomplish when the include contains the header-markup. This could be facilitated by some global variables that are set prior to the include-section i.e.:
<%
title = "Title for this page's content"
%>
<!-- #include virtual="/includes/header.asp" -->
content goes here
<!-- #include virtual="/includes/footer.asp" -->
and then in the header like so
<!DOCTYPE html>
<html>
<head>
<title><%=title%></title>
<link rel="stylesheet" href="/css/site.css" />
</head>
<body>
but that already begins to "smell" a little because you set up some expectations for the including page inside the include-file. At least you have to be very disciplined when constructing your pages.
The term you're looking for is Master Page, not Global Page, that may be why you're having a hard time finding what you're looking for on Google. Basically consider a master page a template. You create a master page, then load other pages into it. There are content place holders that you put in the master then populate on your other pages.
So a very basic example would look something like this.
<%# Master Language="VB" CodeFile="general.master.vb" Inherits="master1_general"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<link rel="stylesheet" type="text/css" href="/styles/main.css?v2"/>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<asp:ContentPlaceHolder id="body" runat="server">
</asp:ContentPlaceHolder>
</form>
</body>
</html>
Then your individual pages would look like this:
<%# Page Language="VB" MasterPageFile="~/master/general.master" AutoEventWireup="false" CodeFile="base.aspx.vb" Inherits="_Default" title="Opportunities" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
//any additional head stuff specific to this page goes here.
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="body" Runat="Server" >
//your body mark up goes here.
</asp:Content>
Notice how the Master page is actually a web page. Then it has place holders in certain spots. In this one there is a place holder in the head and one in the body. Then on individual pages I identify which master page to use and what data (if any) goes in the place holders. I always include a placeholder in the head so I can load js or resources that specific pages need on that page only.
Then the individual pages are just the content that goes in the placeholders.
So, using the aspx rendering engine for the MVC3 framework, it is easy to define a section in the master layout page and insert html or asp code inside those sections that will appear on every page, like so:
On the master layout
<!-- Secondary content -->
<div id="content-secondary">
<asp:ContentPlaceHolder ID="NavigationSecondary" runat="server">
<% Html.RenderAction("Menu", "Navigation", new { #id = "nav-secondary"}); %>
</asp:ContentPlaceHolder>
<asp:ContentPlaceHolder ID="cphSecondary" runat="server" />
</div>
<!-- /Secondary content -->
You can see that a Menu is rendered inside the ContentPlaceHolder called NavigationSecondary. So on every page that I create, the menu is displayed by default and any other extra content is displayed below that.
Now, how would I interpret this in the Razor engine? I couldn't find much info online. I did find something that shows how to use default content. But would that default content be erased when inserted with content from another page?
Razor view engine allows checking (in _Layout.cshtml) if layout section has been implemented by views so with this you could mimic putting code inside ContentPlaceHolder.
<div id="content-secondary">
#if (IsSectionDefined("NavigationSecondary"))
{
Html.RenderAction("Menu", "Navigation", new {#id = "nav-secondary"});
#RenderSection("NavigationSecondary")
}
</div>
Hope this is what you are looking for.