Short answer: No, you don't need to have the select box within a form.
Where is your JavaScript currently included with respect to the body
tag in your HTML? Remember that if you have inline JavaScript included in the head if your page, then it will fire as the page is loaded. At this point, the select box will not have been parsed and, thus, your code cannot access it in order to disable it.
I'm no fan of mixing JavaScript and markup together, but this demo should work for all intents and purposes.
<html>
<head>
<title>JavaScript Select Demo</title>
</head>
<body>
<select id="mySelect" onchange="updateChoice();">
<option value="1">First</option>
<option value="2" selected="">Second</option>
</select>
</body>
<script type="text/javascript">
document.getElementById('mySelect').disabled = true;
</script>
</html>
If, for whatever reason, you have to keep the script located in the page rather than an external file, you could setup an event handler to perform the same functionality after the page has loaded. Rather than keeping code at the bottom of the markup, you can include this in your head node:
<head>
<title>JavaScript Select Demo</title>
<script type="text/javascript">
window.onload = function() {
document.getElementById('mySelect').disabled = true; ;
}
</script>
</head>
Lastly, rather than incorporate an onchange
handler in the attributes of your markup, you could alternatively setup an event handler in your JavaScript to perform the same behavior. jQuery makes this really easy.