Hi,
I am using (conditionally for IE) attachEvent to attach a function to a dynamically made checkbox. The function I am 'attaching' simply displays an alert message. I am attaching it with the 'onclick' event.
OK, I don't get any errors, BUT, when I click the checkbox, I don't get an alert message.
My code - cut and pasted below the line.
I appreciate any help!!
Thanks,
VmusicV
I hope the tags in my sample code don't mess up the post?
--------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Test IE attachEvent </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="JavaScript">
function createControls(){
alert('Creating input box and check box');
//add form elements in JS
var theForm = document.forms.tester;
//set var to add a unique number to control name
var next_elem = theForm.elements.length + 1;
//alert("Creating the label for the input box");
var label_inputTitle = document.createTextNode("Enter Input Here");
var span_inputTitle = document.createElement('span');
span_inputTitle.appendChild (label_inputTitle);
//alert("Creating the label for the check box");
var label_cbTitle = document.createTextNode("Check Box Here");
var span_cbTitle = document.createElement('span');
span_cbTitle.appendChild (label_cbTitle);
//create textbox
//alert("Creating the actual input box");
var inputControl = document.createElement('input');
inputControl.setAttribute('name', 'new_ai_heading'+ next_elem );
inputControl.setAttribute('type', 'text');
inputControl.setAttribute('size', '60');
//create checkbox
//alert("Creating the actual check box");
var checkboxControl = document.createElement('input');
checkboxControl.setAttribute('name', 'new_ai_delete'+ next_elem );
checkboxControl.setAttribute('type', 'checkbox');
//add a listner
if (!document.addEventListener){
// MS or IE or les miserables
var didItAttach = checkboxControl.attachEvent('onClick', callDisableCheckBox);
if(didItAttach){
alert('IE specific code to attach event worked');
}else{
alert('IE specific code to attach event failed');
}
}else{
//FireFox...etc.
checkboxControl.addEventListener("onclick", "disableAgendaItem(this.id)", false);
}
//now append the controls
alert('Appending labels and controls to form');
theForm.appendChild(span_inputTitle);
theForm.appendChild(inputControl);
theForm.appendChild(span_cbTitle);
theForm.appendChild(checkboxControl);
} //end of function to add control
//function to call to another function to disable the checkbox
function callDisableCheckBox(){
alert('Testing One, Two Three.... inside the attachEvent function to call a function to disable the checkbox');
}//end function to call another function to disable the checkbox
</script>
</HEAD>
<BODY>
<form name="tester" action="" onSubmit="return isItGood()">
<br>
<input type="button" onClick="createControls()" value="Click Me I'm Irish" name="TestButton">
</form>
</BODY>
</HTML>
I am using (conditionally for IE) attachEvent to attach a function to a dynamically made checkbox. The function I am 'attaching' simply displays an alert message. I am attaching it with the 'onclick' event.
OK, I don't get any errors, BUT, when I click the checkbox, I don't get an alert message.
My code - cut and pasted below the line.
I appreciate any help!!
Thanks,
VmusicV
I hope the tags in my sample code don't mess up the post?
--------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Test IE attachEvent </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="JavaScript">
function createControls(){
alert('Creating input box and check box');
//add form elements in JS
var theForm = document.forms.tester;
//set var to add a unique number to control name
var next_elem = theForm.elements.length + 1;
//alert("Creating the label for the input box");
var label_inputTitle = document.createTextNode("Enter Input Here");
var span_inputTitle = document.createElement('span');
span_inputTitle.appendChild (label_inputTitle);
//alert("Creating the label for the check box");
var label_cbTitle = document.createTextNode("Check Box Here");
var span_cbTitle = document.createElement('span');
span_cbTitle.appendChild (label_cbTitle);
//create textbox
//alert("Creating the actual input box");
var inputControl = document.createElement('input');
inputControl.setAttribute('name', 'new_ai_heading'+ next_elem );
inputControl.setAttribute('type', 'text');
inputControl.setAttribute('size', '60');
//create checkbox
//alert("Creating the actual check box");
var checkboxControl = document.createElement('input');
checkboxControl.setAttribute('name', 'new_ai_delete'+ next_elem );
checkboxControl.setAttribute('type', 'checkbox');
//add a listner
if (!document.addEventListener){
// MS or IE or les miserables
var didItAttach = checkboxControl.attachEvent('onClick', callDisableCheckBox);
if(didItAttach){
alert('IE specific code to attach event worked');
}else{
alert('IE specific code to attach event failed');
}
}else{
//FireFox...etc.
checkboxControl.addEventListener("onclick", "disableAgendaItem(this.id)", false);
}
//now append the controls
alert('Appending labels and controls to form');
theForm.appendChild(span_inputTitle);
theForm.appendChild(inputControl);
theForm.appendChild(span_cbTitle);
theForm.appendChild(checkboxControl);
} //end of function to add control
//function to call to another function to disable the checkbox
function callDisableCheckBox(){
alert('Testing One, Two Three.... inside the attachEvent function to call a function to disable the checkbox');
}//end function to call another function to disable the checkbox
</script>
</HEAD>
<BODY>
<form name="tester" action="" onSubmit="return isItGood()">
<br>
<input type="button" onClick="createControls()" value="Click Me I'm Irish" name="TestButton">
</form>
</BODY>
</HTML>
