Helpful Information
 
 
Category: DOM and JSON scripting
Input (checkbox) object

Edit : Blue parts are added after jkd's suggestion.

Following code does not work on IE. Moz handles it nicely.

Can anybody say, how to set for IE whether checbox is checked? I've tried also setAttribute() and to set checked property to "checked", but none of these works on IE :(.

<!-- Example Written by Zvona -->
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Creating a checked checkbox</title>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1;" />
<script type="text/javascript">
window.onload = function()
{
var oForm = document.createElement("form");
var oCheckB = document.createElement("input");
var oButton = document.createElement("input");

oCheckB.setAttribute("type","checkbox");
oCheckB.checked = true;

oButton.setAttribute("type","button");
oButton.onclick = function()
{
document.forms[0].elements[0].checked = !oCheckB.checked;
}

oForm.appendChild(oCheckB);
oForm.appendChild(oButton);

document.body.appendChild(oForm);
}
</script>
</head>

<body>
</body>
</html>

Well, I see two possibilities:

#1. IE is stupid (well, that's the cause of this anyway :D), and when it sees the <?xml?> processing instruction in a .html document, it throws itself into quirks mode. :rolleyes: This may somehow affect how properties are done on dynamically created elements, though I couldn't say for sure.

#2. Have you tried setting checked = true when the node is live in the page? i.e. after you have appended the form and checkbox to the body, try setting the checkbox checked property. I don't see any reason why that shouldn't work in IE, though it would be slightly inefficient to modify a "live" object.

Originally posted by jkd
#2. Have you tried setting checked = true when the node is live in the page? i.e. after you have appended the form and checkbox to the body, try setting the checkbox checked property. I don't see any reason why that shouldn't work in IE, though it would be slightly inefficient to modify a "live" object.

Yup, that was the problem. I fixed the code above to demonstrate checking/unchecking a box is possible with IE after the node is appended.

However, I've still got a problem : I've created a constructor, which applies data from db,
var myCheckBox = new Checkbox(<% =rsSet("bOnline") %>);

where bOnline is a boolean whether current record is online or not. How can I tell to function Checkbox to re-apply boolean value for object after it's appended into document?

C'est impossible?

When you appendChild(), it returns a reference to the live node:

var form = document.createElement('form');
var radio = document.createElement('input');
radio.setAttribute('type', 'radio');

form.appendChild(radio);

form = document.body.appendChild(form);
radio = form.lastChild;
radio.checked = true;










privacy (GDPR)