ASCX as Header/Footer

P

Peter Wu

Hello,

I want to create a Header and Footer for every ASPX page I build. I
created 2 Web user controls respectively and placed them in an ASPX page.
The problem is that I cannot position the Footer to be always at the
bottom of the page. The Header and Footer are always together at the top
of the page.

Was I missing anything? Thanks!
 
R

Ron Vecchi

Sounds like an html prob.

A usercontrol will show up where it has been placed with in your document
structure. Similar to SSI.
 
P

Peter Wu

Ron Vecchi said:
Sounds like an html prob.

A usercontrol will show up where it has been placed with in your
document structure. Similar to SSI.

The problem is that I cannot move it to the bottom of the page. :-(
 
S

Steve C. Orr, MCSD

Double check to make sure your HTML is well formed in your page and ASCX
(and the combined HTML output.)
Even if it was well formed to begin with, sometimes the designer "helps" you
by adding closing HTML elements in places where you didn't want them.
 
P

Peter Wu

Steve C. Orr said:
Just drag or cut/paste the footer control down to the bottom of the page
where you want it.

Unfortunately, it does not work. :(

Here goes my page in HTML. Thanks.


<%@ Page language="c#" Codebehind="Login.aspx.cs" AutoEventWireup="false"
Inherits="WUTT.Login" %>
<%@ Register TagPrefix="uc1" TagName="Header" Src="Header.ascx" %>
<%@ Register TagPrefix="uc1" TagName="Footer" Src="Footer.ascx" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Login</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<LINK href="Style.css" type="text/css" rel="stylesheet">
</HEAD>
<body ms_positioning="GridLayout">
<p></p>
<form id="Form1" method="post" runat="server">
<uc1:Header id="Header1" runat="server"></uc1:Header>

<asp:TextBox id="txtUsername" style="Z-INDEX: 101; LEFT: 462px;
POSITION: absolute; TOP: 187px"
runat="server" Width="240px" tabIndex="1" Height="22"></asp:TextBox>
<asp:TextBox id="txtPassword" style="Z-INDEX: 102; LEFT: 462px;
POSITION: absolute; TOP: 216px"
runat="server" Width="240px" TextMode="Password" tabIndex="2"
Height="22"></asp:TextBox>
<DIV style="DISPLAY: inline; Z-INDEX: 103; LEFT: 330px; WIDTH: 121px;
POSITION: absolute; TOP: 187px; HEIGHT: 22px"
ms_positioning="FlowLayout">
<P>Username:</P>
</DIV>
<DIV style="DISPLAY: inline; Z-INDEX: 104; LEFT: 330px; WIDTH: 121px;
POSITION: absolute; TOP: 216px; HEIGHT: 22px"
ms_positioning="FlowLayout">Password:</DIV>
<asp:Button id="btnLogin" style="Z-INDEX: 105; LEFT: 489px; POSITION:
absolute; TOP: 270px"
runat="server" Width="104px" Text="Login" tabIndex="2"
Height="24px"></asp:Button><INPUT style="Z-INDEX: 106; LEFT: 599px; WIDTH:
104px; POSITION: absolute; TOP: 270px; HEIGHT: 24px"
type="reset" size="100px" value="Reset" tabIndex="3">
<asp:Label id="lblWarning" style="Z-INDEX: 107; LEFT: 339px; POSITION:
absolute; TOP: 331px"
runat="server" Width="366px" Visible="False" Font-Overline="True"
Font-Underline="True"
Font-Bold="True" ForeColor="Red" Height="7px">* Bad username or
password. Please try again!</asp:Label>
<DIV style="DISPLAY: inline; Z-INDEX: 108; LEFT: 80px; WIDTH: 206px;
POSITION: absolute; TOP: 50px; HEIGHT: 28px"
ms_positioning="FlowLayout">
<P>Login</P>
</DIV>
<DIV style="DISPLAY: inline; FONT-SIZE: larger; Z-INDEX: 109; LEFT:
288px; WIDTH: 384px; POSITION: absolute; TOP: 120px; HEIGHT: 16px"
ms_positioning="FlowLayout">Welcome! Please enter your username and
password.
</DIV>

<uc1:Footer id="Footer1" runat="server"></uc1:Footer>
</form>
</body>
</HTML>
 
S

Seaside

I use all user controls on most of my sites. I use header, top navigation,
left navigation content to the right and a footer. Each of these elements is
a user control. The trick is to be sure that your code makes sense from top
to bottom tracking it all the way through your user controls as if it were
one page without user controls.

There is an example of this method at http://islandclub.us

HTH
 
P

Peter Wu

Steve C. Orr said:
Double check to make sure your HTML is well formed in your page and ASCX
(and the combined HTML output.)
Even if it was well formed to begin with, sometimes the designer
"helps" you by adding closing HTML elements in places where you didn't
want them.

I think ASP.NET generates the HTML code correctly. Now, it is the IE
problem. Why doesn 't IE display the copyright claim at the bottom?
Thanks.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Login</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<LINK href="Style.css" type="text/css" rel="stylesheet">
</HEAD>
<body>
<form name="Form1" method="post"
action="Login.aspx?ReturnUrl=%2fWUTT%2fMainMenu.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE"
value="dDw2MjkwNDU3Mzg7Oz75y+cu2/Z/dMJFgwdibwILNJVAyg==" />

<input name="txtUsername" type="text" id="txtUsername" tabindex="1"
style="height:22px;width:240px;Z-INDEX: 101; LEFT: 462px; POSITION:
absolute; TOP: 187px" />
</form>

<div>Copyright
This program is protected by
US and international copyright law.</div>

</body>
</HTML>
 
M

Michael

Try putting the header and footer into separate files.
That way you can use them anywhere you want.

HTH
 
R

Rory

Why not try creating a base page class that already has
the header and footer interface defined. Then all your
pages can just derive from this.
 
P

Peter Wu

Rory said:
Why not try creating a base page class that already has
the header and footer interface defined. Then all your
pages can just derive from this.

Any samples how to do this? Thanks.
 
P

Peter Wu

Steve C. Orr said:
OIC, it looks like you are using GridLayout.
Notice how all your web controls have pixel positions listed? Well your
header and footer do not. This is basically the same as saying that
the top & left are 0,0 (at the top of the form)
Either give them pixel positions or switch your page to Flow Layout and
get rid of all the positioning HTML code.

I still use GridLayout for the form and give the Footer the pixel position
like this:

<uc1:Footer id="Footer1" runat="server" style="Z-INDEX: 107; LEFT: 0px;
POSITION: absolute; TOP: 500px"></uc1:Footer>

But it does not help. The rendered HTML just loses the position specified.
Please help!
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,731
Messages
2,569,432
Members
44,832
Latest member
GlennSmall

Latest Threads

Top