Recently, I was trying to modify an existing aspx page when client-side
validation on that page stopped working. I searched this group and the web
in general and found that other people have had the same issue. However,
none of the suggested fixes solved my particular problem. I tracked down the
cause of the problem, which is related to aspx page parser's handling of
controls inside html comments. The problem may be quite common and well
known. However, since I was not able to find an explanation anywhere, I am
going post my findings in case others run into the same issue.
The problem is related to how aspx page parser translates apsx controls
inside html comments. For example, the following code
<!--
<asp:TextBox id="TextBox1" runat="server"> </asp:TextBox>
-->
generates the following html
<!--
<input name="TextBox1" type="text" id="TextBox1" />
-->
Essentially, the parser ignores the comment and renders the control in html.
This presents no problem because the rendered html is enclosed inside html
comment and will be ignored by the browser. However, if there is a
validation control inside a html comment, such as the code below,
<!--
<asp:TextBox id="TextBox1" runat="server"> </asp:TextBox>
<asp:RequiredFi eldValidator id="rfvTextBox1 " runat="server"
ControlToValida te="TextBox1"> </asp:RequiredFie ldValidator>
-->
a problem occurs. The parser translates this comment into
<!--
<input name="TextBox1" type="text" id="TextBox1" />
<span id="rfvTextBox1 " controltovalida te="TextBox1"
evaluationfunct ion="RequiredFi eldValidatorEva luateIsValid" initialvalue=""
style="color:Re d;visibility:hi dden;"></span>
-->
The parser also adds the following javascript to the rendered page
<script language="javas cript" type="text/javascript">
<!--
var Page_Validators = new Array(document. all["rfvFName"],
document.all["rfvLName"], document.all["rfvEmail"],
document.all["rfvTextBox 1"]);
// -->
</script>
In addition to the required field validator shown above, there are several
other validation controls on my page and all of them are listed in the array
Page_Validators . The issue is that document.all["rfvTextBox 1"] always
returns null because it is enclosed inside html comment. The problem hits
home when client-side validation is initialized during a page load. Below is
the initialization function, copied exactly from WebUIValidation .js,
function ValidatorOnLoad () {
if (typeof(Page_Va lidators) == "undefined" )
return;
var i, val;
for (i = 0; i < Page_Validators .length; i++) {
val = Page_Validators[i];
if (typeof(val.eva luationfunction ) == "string") {
eval("val.evalu ationfunction = " + val.evaluationf unction +
";");
}
if (typeof(val.isv alid) == "string") {
if (val.isvalid == "False") {
val.isvalid = false;
Page_IsValid = false;
}
else {
val.isvalid = true;
}
} else {
val.isvalid = true;
}
if (typeof(val.ena bled) == "string") {
val.enabled = (val.enabled != "False");
}
ValidatorHookup ControlID(val.c ontroltovalidat e, val);
ValidatorHookup ControlID(val.c ontrolhookup, val);
}
Page_Validation Active = true;
}
This function hooks up each validators defined in the Page_Validators array.
However, as in the example given above, the last validator is null and the
code does not guard against nulls! This results in an exception, and the
variable Page_Validation Active is never set to true, effectively turning off
client-side validation.
Hong Hao
