By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,972 Members | 1,099 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,972 IT Pros & Developers. It's quick & easy.

A bug in apsx client-side validation?

P: n/a
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:RequiredFieldValidator id="rfvTextBox1" runat="server"
ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
-->

a problem occurs. The parser translates this comment into

<!--
<input name="TextBox1" type="text" id="TextBox1" />
<span id="rfvTextBox1" controltovalidate="TextBox1"
evaluationfunction="RequiredFieldValidatorEvaluate IsValid" initialvalue=""
style="color:Red;visibility:hidden;"></span>
-->

The parser also adds the following javascript to the rendered page

<script language="javascript" type="text/javascript">
<!--
var Page_Validators = new Array(document.all["rfvFName"],
document.all["rfvLName"], document.all["rfvEmail"],
document.all["rfvTextBox1"]);
// -->
</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["rfvTextBox1"] 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_Validators) == "undefined")
return;
var i, val;
for (i = 0; i < Page_Validators.length; i++) {
val = Page_Validators[i];
if (typeof(val.evaluationfunction) == "string") {
eval("val.evaluationfunction = " + val.evaluationfunction +
";");
}
if (typeof(val.isvalid) == "string") {
if (val.isvalid == "False") {
val.isvalid = false;
Page_IsValid = false;
}
else {
val.isvalid = true;
}
} else {
val.isvalid = true;
}
if (typeof(val.enabled) == "string") {
val.enabled = (val.enabled != "False");
}
ValidatorHookupControlID(val.controltovalidate, val);
ValidatorHookupControlID(val.controlhookup, val);
}
Page_ValidationActive = 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_ValidationActive is never set to true, effectively turning off
client-side validation.

Hong Hao
Nov 19 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
> 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:RequiredFieldValidator id="rfvTextBox1" runat="server"
ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
-->

a problem occurs. The parser translates this comment into

<!--
<input name="TextBox1" type="text" id="TextBox1" />
<span id="rfvTextBox1" controltovalidate="TextBox1"
evaluationfunction="RequiredFieldValidatorEvaluate IsValid" initialvalue=""
style="color:Red;visibility:hidden;"></span>
-->

The parser also adds the following javascript to the rendered page

<script language="javascript" type="text/javascript">
<!--
var Page_Validators = new Array(document.all["rfvFName"],
document.all["rfvLName"], document.all["rfvEmail"],
document.all["rfvTextBox1"]);
// -->
</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["rfvTextBox1"] 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_Validators) == "undefined")
return;
var i, val;
for (i = 0; i < Page_Validators.length; i++) {
val = Page_Validators[i];
if (typeof(val.evaluationfunction) == "string") {
eval("val.evaluationfunction = " + val.evaluationfunction + ";");
}
if (typeof(val.isvalid) == "string") {
if (val.isvalid == "False") {
val.isvalid = false;
Page_IsValid = false;
}
else {
val.isvalid = true;
}
} else {
val.isvalid = true;
}
if (typeof(val.enabled) == "string") {
val.enabled = (val.enabled != "False");
}
ValidatorHookupControlID(val.controltovalidate, val);
ValidatorHookupControlID(val.controlhookup, val);
}
Page_ValidationActive = 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_ValidationActive is never set to true, effectively turning off
client-side validation.

Hong Hao


True, the parser looks just for "runat=server" controls and ignores
client-side comment brackets. This might be by design: you could put
a Label there to render client-side comments.
Unfortunately this has the side-effect that you noticed.

A couple of ways around it:
- use server-side comments: <%!-- --%>
- remove the "runat=server" (I usually "destroy" it by adding an "X":
runXat=server is not recognised and ignored)

Hans Kesting
Nov 19 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.