4
42
I implemented a simple class inherited from Page to create a page
template. It simply wraps some trivial html around the inherited page,
and puts the inherited page into a form.
The problem I have run into is that the emitted html at the end of the
process is slightly different and doesn't work.
Please don't be put off by all the source code. All the guts are in this
first base class, and it doesn't do much. The rest is trivial
boilerplate, and the ugly stuff near the bottom is emitted code, and its
only there to highlight the problem, which has already been located.
Source for BaseClass
--------
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace Test
{
public class TestPageBase : System.Web.UI.Page
{
protected override void OnInit(System.EventArgs e)
{
BuildPage( GenerateHtmlForm() );
base.OnInit(e);
}
protected void BuildPage(HtmlForm form)
{
////////////////////////////////////////////////////////
// Build the page and include inherited page content
this.Controls.AddAt( 0, new LiteralControl(
@"<HTML><body>") );
this.Controls.Add(form);
this.Controls.Add( new LiteralControl( @"</body></HTML>"));
}
private HtmlForm GenerateHtmlForm()
{
HtmlForm form = new HtmlForm();
AddControlsFromDerivedPage(form);
return form;
}
private void AddControlsFromDerivedPage(HtmlForm form)
{
int count = this.Controls.Count;
for( int i = 0; i<count; ++i )
{
System.Web.UI.Control ctrl = this.Controls[0];
form.Controls.Add( ctrl );
this.Controls.Remove( ctrl );
}
}
}
}
The inherited page is dead simple, and is a simple
'requiredfieldvalidator' example:
It should display a textbox, and a button. If you press submit when the
textbox is empty it should show the message.
------
<%@ Page language="c#" Codebehind="test.aspx.cs" AutoEventWireup="false"
Inherits="AccelRate.test" %>
Name: <asp:textbox id=name runat="server"/>
<br>
<asp:button id=Button1 runat="server" Text="Submit"/>
<br>
<asp:requiredfieldvalidator id=Requiredfieldvalidator1 runat="server"
Text="The name field is required!" ControlToValidate="name"/>
-------
And the codebehind equally trivial, all boilerplate except that it
inherits from test page base.
-------
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace Test
{
/// <summary>
/// Summary description for page1.
/// </summary>
public class test : Test.TestPageBase
{
protected System.Web.UI.WebControls.TextBox name;
protected System.Web.UI.WebControls.Button Button1;
protected System.Web.UI.WebControls.RequiredFieldValidator
Requiredfieldvalidator1;
private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web
Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
--------
If you manually created the page it would be simply:
<html>
<body>
<form>
Name: <asp:textbox id=name runat="server"/>
<br>
<asp:button id=Button1 runat="server" Text="Submit"/>
<br>
<asp:requiredfieldvalidator id=Requiredfieldvalidator1 runat="server"
Text="The name field is required!" ControlToValidate="name"/>
</form>
</body>
</html>
------
The problem I've encountered is that the requiredfieldvalidator in the
first example doesn't work but does in the 2nd. I have determined that
the emitted code is slightly different for the 2 examples:
The first example (which does not work) results in:
-----------------
<HTML>
<body>
<form name="_ctl0" method="post" action="test.aspx"
language="javascript" onsubmit="ValidatorOnSubmit();" id="_ctl0">
<input type="hidden" name="__VIEWSTATE"
value="dDwtOTAwMjE1Mjk7Oz6ozVxOm9z0Jb82dYC0l6HUS35h6w==" />
<script language="javascript"
src="/aspnet_client/system_web/1_1_4322/WebUIValidation.js"></script>
Name: <input name="name" type="text" id="name" />
<br>
<input type="submit" name="Button1" value="Submit" id="Button1" />
<br>
<span id="Requiredfieldvalidator1" controltovalidate="name"
evaluationfunction="RequiredFieldValidatorEvaluateIsValid"
initialvalue="" style="color:Red;visibility:hidden;">The name field is
required!</span>
<script language="javascript">
<!--
var Page_Validators = new
Array(document.all["Requiredfieldvalidator1"]);
// -->
</script>
<script language="javascript">
<!--
var Page_ValidationActive = false;
if (typeof(clientInformation) != "undefined" &&
clientInformation.appName.indexOf("Explorer") != -1) {
if (typeof(Page_ValidationVer) == "undefined")
alert("Unable to find script library
'/aspnet_client/system_web/1_1_4322/WebUIValidation.js'. Try placing
this file manually, or reinstall by running 'aspnet_regiis -c'.");
else if (Page_ValidationVer != "125")
alert("This page uses an incorrect version of
WebUIValidation.js. The page expects version 125. The script library is
" + Page_ValidationVer + ".");
else
ValidatorOnLoad();
}
function ValidatorOnSubmit() {
if (Page_ValidationActive) {
ValidatorCommonOnSubmit();
}
}
// -->
</script>
</form>
</body>
</HTML>
-------
The 2nd example, which does work is identical, except for the:
<input type="submit" name="Button1" value="Submit" id="Button1" />
becomes:
<input type="submit" name="Button1" value="Submit" onclick="if
(typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); "
language="javascript" id="Button1" />
Obviously the missing onclick is responsible for the validator not
working in the first example!!!
My question is threefold: WHY is the onclick event missing, WHAT did I
do wrong, and above all HOW do I revise my template solution to get it
to work?
Thanks in advance
template. It simply wraps some trivial html around the inherited page,
and puts the inherited page into a form.
The problem I have run into is that the emitted html at the end of the
process is slightly different and doesn't work.
Please don't be put off by all the source code. All the guts are in this
first base class, and it doesn't do much. The rest is trivial
boilerplate, and the ugly stuff near the bottom is emitted code, and its
only there to highlight the problem, which has already been located.
Source for BaseClass
--------
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace Test
{
public class TestPageBase : System.Web.UI.Page
{
protected override void OnInit(System.EventArgs e)
{
BuildPage( GenerateHtmlForm() );
base.OnInit(e);
}
protected void BuildPage(HtmlForm form)
{
////////////////////////////////////////////////////////
// Build the page and include inherited page content
this.Controls.AddAt( 0, new LiteralControl(
@"<HTML><body>") );
this.Controls.Add(form);
this.Controls.Add( new LiteralControl( @"</body></HTML>"));
}
private HtmlForm GenerateHtmlForm()
{
HtmlForm form = new HtmlForm();
AddControlsFromDerivedPage(form);
return form;
}
private void AddControlsFromDerivedPage(HtmlForm form)
{
int count = this.Controls.Count;
for( int i = 0; i<count; ++i )
{
System.Web.UI.Control ctrl = this.Controls[0];
form.Controls.Add( ctrl );
this.Controls.Remove( ctrl );
}
}
}
}
The inherited page is dead simple, and is a simple
'requiredfieldvalidator' example:
It should display a textbox, and a button. If you press submit when the
textbox is empty it should show the message.
------
<%@ Page language="c#" Codebehind="test.aspx.cs" AutoEventWireup="false"
Inherits="AccelRate.test" %>
Name: <asp:textbox id=name runat="server"/>
<br>
<asp:button id=Button1 runat="server" Text="Submit"/>
<br>
<asp:requiredfieldvalidator id=Requiredfieldvalidator1 runat="server"
Text="The name field is required!" ControlToValidate="name"/>
-------
And the codebehind equally trivial, all boilerplate except that it
inherits from test page base.
-------
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace Test
{
/// <summary>
/// Summary description for page1.
/// </summary>
public class test : Test.TestPageBase
{
protected System.Web.UI.WebControls.TextBox name;
protected System.Web.UI.WebControls.Button Button1;
protected System.Web.UI.WebControls.RequiredFieldValidator
Requiredfieldvalidator1;
private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web
Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
--------
If you manually created the page it would be simply:
<html>
<body>
<form>
Name: <asp:textbox id=name runat="server"/>
<br>
<asp:button id=Button1 runat="server" Text="Submit"/>
<br>
<asp:requiredfieldvalidator id=Requiredfieldvalidator1 runat="server"
Text="The name field is required!" ControlToValidate="name"/>
</form>
</body>
</html>
------
The problem I've encountered is that the requiredfieldvalidator in the
first example doesn't work but does in the 2nd. I have determined that
the emitted code is slightly different for the 2 examples:
The first example (which does not work) results in:
-----------------
<HTML>
<body>
<form name="_ctl0" method="post" action="test.aspx"
language="javascript" onsubmit="ValidatorOnSubmit();" id="_ctl0">
<input type="hidden" name="__VIEWSTATE"
value="dDwtOTAwMjE1Mjk7Oz6ozVxOm9z0Jb82dYC0l6HUS35h6w==" />
<script language="javascript"
src="/aspnet_client/system_web/1_1_4322/WebUIValidation.js"></script>
Name: <input name="name" type="text" id="name" />
<br>
<input type="submit" name="Button1" value="Submit" id="Button1" />
<br>
<span id="Requiredfieldvalidator1" controltovalidate="name"
evaluationfunction="RequiredFieldValidatorEvaluateIsValid"
initialvalue="" style="color:Red;visibility:hidden;">The name field is
required!</span>
<script language="javascript">
<!--
var Page_Validators = new
Array(document.all["Requiredfieldvalidator1"]);
// -->
</script>
<script language="javascript">
<!--
var Page_ValidationActive = false;
if (typeof(clientInformation) != "undefined" &&
clientInformation.appName.indexOf("Explorer") != -1) {
if (typeof(Page_ValidationVer) == "undefined")
alert("Unable to find script library
'/aspnet_client/system_web/1_1_4322/WebUIValidation.js'. Try placing
this file manually, or reinstall by running 'aspnet_regiis -c'.");
else if (Page_ValidationVer != "125")
alert("This page uses an incorrect version of
WebUIValidation.js. The page expects version 125. The script library is
" + Page_ValidationVer + ".");
else
ValidatorOnLoad();
}
function ValidatorOnSubmit() {
if (Page_ValidationActive) {
ValidatorCommonOnSubmit();
}
}
// -->
</script>
</form>
</body>
</HTML>
-------
The 2nd example, which does work is identical, except for the:
<input type="submit" name="Button1" value="Submit" id="Button1" />
becomes:
<input type="submit" name="Button1" value="Submit" onclick="if
(typeof(Page_ClientValidate) == 'function') Page_ClientValidate(); "
language="javascript" id="Button1" />
Obviously the missing onclick is responsible for the validator not
working in the first example!!!
My question is threefold: WHY is the onclick event missing, WHAT did I
do wrong, and above all HOW do I revise my template solution to get it
to work?
Thanks in advance