Hi:
It seems that the following code snippet works for IE 7 and FireFox
but not for IE6:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
<script type="text/javascript" src="jquery-1.2.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("a#clickme").click(function() {
var $x = $("select#dept");
$x.html("<option value='0'>Select...</option>");
$x.append("<option value='1'>First</option>");
$("[EMAIL PROTECTED]'0']",
$x).attr("selected","selected");
});
});
</script>
</head>
<body>
<a id="clickme" href="javascript:{}">click here</a>
<table>
<tr>
<td>
<label>Department: </label>
</td><td>
<select id="dept" name="dept" tabindex="1">
</select>
</td>
</tr>
</table>
</body>
</html>
On IE6, I am getting this error:
Line: 867
Char: 30
Error: Could not set the selected property. Unspecified error.
Code: 0
URL: http://localhost:8080/jQueryTutorial/select.html
However, if I change the scriptlet to use direct DOM object as shown
below, IE 6 is happy.
$(document).ready(function() {
$("a#clickme").click(function() {
var $x = $("select#dept");
var y = $x.get(0)
y.options[0] = new Option;
y.options[0].text = "Select...";
y.options[0].value = 0;
y.options[0].selected = "selected";
y.options[1] = new Option;
y.options[1].text = "First";
y.options[1].value = 1;
});
});
Has anyone experienced the same issue?
Thanks in advance.