Articles → .NET → ASP.NET XHTML Compliance

ASP.NET XHTML Compliance

Is ASP.NET compliant with XHTML. It is a very common question when you are facing an interview or preparing for an interview. I have searched a lot of sites for the answer and answer which I got is yes. But when I am looking for the reason I didn’t find good stuff.

I have searched a lot on internet and after some research I have found reasons why the answer is yes. I want to share the same with you. Before we start with the tutorial it is important to note that we will check the compliance with the rendered html code. So let us get started.

First of all create a sample web based application by selecting from visual studio installed templates. Now there are certain rules for XHTML compliance

All elements either include an explicit closing tag or are self-closing

[Explanation]: Run the project and right click on the browser and click view source.

The rendered code is

<!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>
	<title> </title>
</head>

<body>
	<form name="form1" method="post" action="Default.aspx" id="form1">
		<div>
			<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE2MTY2ODcyMjlkZNLaISFnJOBvA0oQ9ZjtvoTDUaMl" /> </div>
	</form>
</body>

</html>

Look at the code you can easily check that all the html tags have the closing tag. So rule 1 is followed by ASP.NET.

Tag and attribute names are rendered in lowercase, and attribute values are included in double quotation marks.

[Explanation]: Check the rendered code above. All the attributes are in lowercase and the value of attributes is enclosed in double quotation marks like name, method, action attributes in form tag. So rule 2 is followed by ASP.NET.

Formatting information is rendered using only cascading style sheet styles.

[Explanation]: It means all the styles are not rendered in a non-compliant format like

<font color="red">hi</font>

But the styles are rendered using CSS

To explain it add gridview control on the page and add a back color to the gridview header

<asp:GridView ID="gvRuleThree" runat="server" HeaderStyle-BackColor="Red"> </asp:GridView>

Add the following code in the page load of code behind

DataSet ds = new DataSet();
ds.ReadXml(Server.MapPath("rule_3.xml"));
gvRuleThree.DataSource = ds.Tables[0];
gvRuleThree.DataBind();

This code is to get the information from the xml file. The xml schema is

<?xml version="1.0" encoding="utf-8" ?>
<root>
  <child>child1</child>
  <child>child2</child>
  <child>child3</child>
  <child>child4</child>
</root>

Now run the program and check the rendered HTML

<!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>
	<title> </title>
</head>

<body>
	<form name="form1" method="post" action="Default.aspx" id="form1">
		<div>
			<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE4MDE3NTcxODcPZBYCAgMPZBYCAgEPPCsADQIADxYEHgtfIURhdGFCb3VuZGceC18hSXRlbUNvdW50AgRkDBQrAAEWCB4ETmFtZQUKY2hpbGRfVGV4dB4KSXNSZWFkT25seWgeBFR5cGUZKwIeCURhdGFGaWVsZAUKY2hpbGRfVGV4dBYCZg9kFgoCAQ9kFgJmDw8WAh4EVGV4dAUGY2hpbGQxZGQCAg9kFgJmDw8WAh8GBQZjaGlsZDJkZAIDD2QWAmYPDxYCHwYFBmNoaWxkM2RkAgQPZBYCZg8PFgIfBgUGY2hpbGQ0ZGQCBQ8PFgIeB1Zpc2libGVoZGQYAQULZ3ZSdWxlVGhyZWUPPCsACgEIAgFkyryzGmoNlkjGPgqOgUEngSbk1/c=" /> </div>
		<div>
			<table cellspacing="0" rules="all" border="1" id="gvRuleThree" style="border-collapse:collapse;">
				<tr style="background-color:Red;">
					<th scope="col">child_Text</th>
				</tr>
				<tr>
					<td>child1</td>
				</tr>
				<tr>
					<td>child2</td>
				</tr>
				<tr>
					<td>child3</td>
				</tr>
				<tr>
					<td>child4</td>
				</tr>
			</table>
		</div>
	</form>
</body>

</html>

Here gridview is rendered as table and formatting information is in css instead of the non-compliant code. Hence rule 3 is also followed by ASP.NET.

In ASP.NET, if controls generate IDs, as occurs in the Repeater, GridView, and other controls the format of the IDs match XHTML 1.0 Transitional guidelines.

[Explanation]: It means if controls generate multiple ids then all the ids should be unique. To elaborate it add a textbox control inside the gridview control so the gridview control is changed to

<asp:GridView ID="gvRuleThree" runat="server" HeaderStyle-BackColor="Red">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:TextBox runat="server"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

Again run the program. The grid is shown in figure below

Picture showing the gridview with a textbox and a label

Click to Enlarge

Now check the rendered code

<!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>
	<title> </title>
</head>

<body>
	<form name="form1" method="post" action="default.aspx" id="form1">
		<div>
			<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTkyOTE3NzczMw9kFgICAw9kFgICAQ88KwANAgAPFgQeC18hRGF0YUJvdW5kZx4LXyFJdGVtQ291bnQCBGQMFCsAARYIHgROYW1lBQpjaGlsZF9UZXh0HgpJc1JlYWRPbmx5aB4EVHlwZRkrAh4JRGF0YUZpZWxkBQpjaGlsZF9UZXh0FgJmD2QWCgIBD2QWAgIBDw8WAh4EVGV4dAUGY2hpbGQxZGQCAg9kFgICAQ8PFgIfBgUGY2hpbGQyZGQCAw9kFgICAQ8PFgIfBgUGY2hpbGQzZGQCBA9kFgICAQ8PFgIfBgUGY2hpbGQ0ZGQCBQ8PFgIeB1Zpc2libGVoZGQYAQULZ3ZSdWxlVGhyZWUPPCsACgEIAgFkZUDE/Ou3onhLafNN/QCNRfW25LU=" /> </div>
		<div>
			<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBQK01eLgDQKOhc2fBQKthc2fBQLEh82fBQLjhc2fBX21d0EgZwVtkdBaWgYezHSZwHS/" /> </div>
		<div>
			<table cellspacing="0" rules="all" border="1" id="gvRuleThree" style="border-collapse:collapse;">
				<tr style="background-color:Red;">
					<th scope="col"> </th>
					<th scope="col">child_Text</th>
				</tr>
				<tr>
					<td>
						<input name="gvRuleThree$ctl02$ctl00" type="text" /> </td>
					<td>child1</td>
				</tr>
				<tr>
					<td>
						<input name="gvRuleThree$ctl03$ctl00" type="text" /> </td>
					<td>child2</td>
				</tr>
				<tr>
					<td>
						<input name="gvRuleThree$ctl04$ctl00" type="text" /> </td>
					<td>child3</td>
				</tr>
				<tr>
					<td>
						<input name="gvRuleThree$ctl05$ctl00" type="text" /> </td>
					<td>child4</td>
				</tr>
			</table>
		</div>
	</form>
</body>

</html>

Here all the controls are having different names. Hence rule 4 is also followed by ASP.NET.

form elements include a name attribute

[Explanation]: See any of the rendered code above and you will see the name attribute in form tag. Hence rule 5 is also followed by ASP.NET.

XHTML requires all elements to be enclosed in a container element. such as input elements, are rendered in div elements.

[Explanation]: To elaborate it add a textbox on the page(remove other controls if you want for the sake of simplicity)

<asp:TextBox ID="txtName" runat="server"></asp:TextBox>

Now see the rendered code

<!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>
	<title> </title>
</head>

<body>
	<form name="form1" method="post" action="Default.aspx" id="form1">
		<div>
			<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE3NDI1ODEyMjhkZPf5p4ff8FsM3OEQHCM0SkoFkL79" /> </div>
		<div>
			<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKiwteNAgLEhISFCzdSkT4DBV3uYEShorRdOkj0h+82" /> </div>
		<input name="txtName" type="text" id="txtName" /> </form>
</body>

</html>

Here te viewstate field is enclosed in a container i.e. div but the textbox is not enclosed in any div so this rule is partially followed by ASP.NET

ASP.NET encodes characters, such as & (for example, as & amp;).

[Explanation]: Change the textbox code to

<asp:TextBox ID="txtName" runat="server" Text="&"></asp:TextBox>

Again check the rendered code

<input name="txtName" type="text" value="&" id="txtName" />

Here the text & is encoded to & amp; hence this rule is also followed.

Any script elements that are rendered into the page use the appropriate type attribute (for example, type="type/javascript") and do not include language attribute.
If ASP.NET renders script blocks, the content of the script blocks is rendered inside an XML (HTML) comment.

[Explanation]: Add a linkbutton on the page and check the rendered code

<!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>
	<title> </title>
</head>

<body>
	<form name="form1" method="post" action="Default.aspx" id="form1">
		<div>
			<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
			<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
			<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJMzcxMjI5NDM1ZGSwm9MkcTa26p8riSo14DoQtkA4eA==" /> </div>
		<script type="text/javascript">
		//<![CDATA[ 
		var theForm = document.forms['form1'];
		if(!theForm) {
			theForm = document.form1;
		}

		function __doPostBack(eventTarget, eventArgument) {
			if(!theForm.onsubmit || (theForm.onsubmit() != false)) {
				theForm.__EVENTTARGET.value = eventTarget;
				theForm.__EVENTARGUMENT.value = eventArgument;
				theForm.submit();
			}
		}
		//]] >
		</script>
		<div>
			<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAwKgxKq3DgLEhISFCwKSw44DkvTmJl2cpA0Ugu4P+7MfthbHkU0=" /> </div>
		<input name="txtName" type="text" value="&" id="txtName" /> <a id="lnkTest" href="javascript:__doPostBack('lnkTest','')">Test</a> </form>
</body>

</html>

Check the script tag there is no language attribute in script tag so rule 8 is followed. And the script tag is rendered inside the xml comment so rule 9 is also followed.

Conclusion

XHTML compliance is followed(some rules partially) so we can say the ASP.NET is XHTML compliant.

Posted By -	Karan Gupta

Posted On -	Thursday, December 8, 2011

Query/Feedback

Your Email Id		**

Subject		*

Query/Feedback	Characters remaining 250	**