*cough*
The runat="server" attribute just makes the element programattically
accessible via inherited classes. The output is 100% valid XHTML.
ASP.NET also converts <select runat="server" /> to <select id="foo"
name="foo"></select>
....What I was posting, was my ASPX source, not my XHTML.
When you execute it, this is produced:
--------------------------------------------------------
<form id="Form" method="post" action="/AMS/Admin/Pages/Categories.aspx">
<div><input type="hidden" name="__VIEWSTATE"
value="dDwtMTA5MzAzMDIwMDt0PDtsPGk8Mj47aTw0Pjs+O2w 8dDxwPGw8VGV4dDs+O2w8XDxkbFw+Clw8ZHRcPkZlYXR1cmVzX DwvZHRcPgpcPGRkXD4wXDwvZGRcPlw8L2RsXD4KOz4+Ozs+O3Q 8O2w8aTw3Pjs+O2w8dDx0PDtwPGw8aTwwPjs+O2w8cDxGZWF0d XJlczsxPjs+Pjs+Ozs+Oz4+Oz4+O2w8cmFkU2VjdGlvbjtyYWR DYXRlZ29yeTs+Pg=="
/></div>
<dl>
<dt>Add...</dt>
<dd><label for="radSection" ><input value="1" name="" id="radSection"
type="radio" /> Section</label>
<label for="radCategory"><input value="2" name="" id="radCategory"
type="radio" checked="checked" /> Category</label></dd>
<dt><label for="selSections">Add to</label></dt>
<dd><select name="selSections" id="selSections">
<option value="1">Features</option>
</select></dd>
<dt><label for="txtName">Name</label></dt>
<dd><input name="txtName" id="txtName" type="text" size="30"
maxlength="50" /></dd>
<dt><label for="txtUrlName">URL Name</label></dt>
<dd><input name="txtUrlName" id="txtUrlName" type="text" size="30"
maxlength="50" /></dd>
<dt><label for="selDefaultArticle">Default Article</label></dt>
<dd><select name="selDefaultArticle" id="selDefaultArticle">
</select></dd>
<dt><label for="selPaging">Default Paging</label></dt>
<dd><select name="selPaging" id="selPaging">
<option value="5">5 Articles per list</option>
<option value="10">10</option>
<option value="15">15</option>
<option value="20">20</option>
<option value="25">25</option>
<option value="30">30</option>
<option value="50">50</option>
<option value="100">100</option>
</select></dd>
<dt><label for="selType">Render Type</label></dt>
<dd><select name="selType" id="selType">
<option value="1">Articles (Normal view)</option>
<option value="2">Files (Slimline view)</option>
<option value="4">News (Full Article in list)</option>
</select></dd>
</dl>
<div>
<button id="btnAdd">Add</button>
</div>
<script src="../scripts/Categories.js" type="text/javascript"></script>
</form>
--------------------------------------------------------
Which is valid :)
And ASP.NET doesn't hinder one's ability to outout valid XHTML, all you need
to do is extend the base form and page classes, and ASP isn't an extension
of HTML.
Anyway, I made the changes to the *.js file and now it works like this:
--------------------------------------------------------
var radSection;
var radCategory;
var selSections;
var selPaging;
var selType;
var btnAdd;
window.onload = getElements();
function getElements() {
radSection = document.getElementById("radSection");
radCategory = document.getElementById("radCategory");
selSections = document.getElementById("selSections");
selPaging = document.getElementById("selPaging");
selType = document.getElementById("selType");
btnAdd = document.getElementById("btnAdd");
radSection.onclick = function() {
selSections.disabled = true;
selPaging.disabled = true;
selType.dsiabled = true;
btnAdd.innerHTML = "Add Section";
}
radCategory.onclick = function() {
selSections.disabled = false;
selPaging.disabled = false;
selType.dsiabled = false;
btnAdd.innerHTML = "Add Category";
}
}
--------------------------------------------------------
Events not firing (Clearly I'm doing something wrong) 
