PDA

View Full Version : javascript code not working in ie but working in firefox



sukanya.paul
02-04-2009, 02:24 PM
hi,
i had written a code for creating modules and sub modules dynamically. the problem is the code is working in mozilla but not in ie.. this is a big problem.can anyone help me solve it.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="js/menu.css">
<title>Employ Me - Creating Feature List</title>
<link href="images/styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var addInput_count = 1;
var addSec_count = 1;
function addInput() {
var c = addInput_count++;
var parent = document.getElementById('myform')
var objBr = document.createElement('br');
var objNew = document.createElement('div');
objNew.setAttribute('name', 'mod_div_' + c);
objNew.setAttribute('id', 'mod_div_' + c);
var mod_id = 'mod_div_' + c ;
var objInput1 = document.createElement('input');
objInput1.setAttribute('type', 'text');
objInput1.setAttribute('style','margin-left:50px;');
objInput1.setAttribute('name', 'module_' + c);
var objB = document.createElement('button');
objB.setAttribute('type', 'button');
objB.setAttribute('name', 'addSec');
objB.setAttribute('style', 'margin-left:5px;');
objB.setAttribute('value', c);
objB.setAttribute('onclick', 'alert("hello");');
objB.appendChild(document.createTextNode('add sub module'));
var objC = document.createElement('button');
objC.setAttribute('type', 'button');
objC.setAttribute('name', 'remMod');
objC.setAttribute('style', 'margin-left:5px;');
objC.setAttribute('value', c);
objC.setAttribute('onclick', 'this.parentNode.parentNode.removeChild(this.parentNode);');
objC.appendChild(document.createTextNode('Remove Module'));
objNew.appendChild(document.createElement('br'));

var myText = document.createTextNode("Add Module:");
var font = document.createElement("font");
font.setAttribute('style', 'color:#000066;font-size:10px;font-weight:normal;');
font.appendChild(myText);
objNew.appendChild(font);
objNew.appendChild(objInput1);
objNew.appendChild(objB);objNew.appendChild(objC);
objNew.appendChild(document.createElement('br'));
objNew.appendChild(document.createElement('br'));
parent.appendChild(objNew);
}
function removeElement(divNum) {
var d = document.getElementById('myform');
var olddiv = document.getElementById('mod_div_'+divNum);
d.removeChild(olddiv);
}
function addSec(c) {
var count=0;
var s = addSec_count++;
var parent1 = document.getElementById('mod_div_' + c)
var objNewsec = document.createElement('div');
objNewsec.setAttribute('name', 'sec_div_' + c+'_'+s);
objNewsec.setAttribute('id', 'sec_div_' + c+'_'+s);
var objC = document.createElement('button');
objC.setAttribute('type', 'button');
objC.setAttribute('name', 'addSec');
objC.setAttribute('value', s);
objC.setAttribute('onclick', 'javascript:addSubSec(this.value);');
objC.appendChild(document.createTextNode('add sub section'));
var myText = document.createTextNode("Add Sub Module:");
var font = document.createElement("font");
font.setAttribute('style', 'color:#000066;font-size:10px;font-weight:normal;');
font.appendChild(myText);
objNewsec.appendChild(font);
var objInput2 = document.createElement('input');
objInput2.setAttribute('type', 'text');
objInput2.setAttribute('name', 'Section-'+c +'_'+s);
objInput2.setAttribute('style','margin-left:75px;');
objNewsec.appendChild(objInput2);
objNewsec.appendChild(document.createElement('br'));
parent1.appendChild(objNewsec);
}
</script>

</head>
<body leftmargin="2" topmargin="0" marginheight="2" marginwidth="0">

<table width="101%" height="50%" border="0" cellpadding="0" cellspacing="0" bgcolor="#F6F7F2">
<!-- First Row -->
<tr>
<!-- Second Row End -->
<td height="425" valign="top" bgcolor="f6f7f2"><div align="center">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="center"><span class="bigfnt">
Preparing Feature List </span></td>
</tr>
</table>
<br /> </div>
<table width="97%" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#D0CDAE" >
<tr>
<td align="center" >
<form method="POST" action="form_dyn.php" onSubmit="return check()">
<table width="80%" border="0" cellspacing="0" cellpadding="0">
<tr><td colspan="2">&nbsp;</td></tr>
<tr>
<td valign="top" class="fields">Project Name : </td>
<td><input type="text" name="txtproj_name" id="txtproj_name" /><br /></td>
</tr>
<tr><td colspan="2">&nbsp;</td></tr>
<tr>
<td valign="top" class="fields">Scope of Project</td>
<td><textarea name="txtproj_scope" id="txtproj_scope" rows="10" cols="50" ></textarea></td>
</tr>
<tr><td colspan="2">&nbsp;</td></tr>
</tr>
<tr>
<td colspan="2">
<div style="border:thin solid #000000; overflow:scroll; width:800px; height:300px;">
<input name="moreMods" type="button" id="moreMods" onclick="addInput();" value="Add Module" /><br /><br />
<div id="myform"></div>
</div>
</td>
</tr>
<tr><td colspan="2">&nbsp;</td></tr>
<tr>
<td colspan="2" align="center"><input type="submit" name="submit" value="submit" /></td>
</tr>
<tr><td colspan="2">&nbsp;</td></tr>
</table>
</form>
</td>
</tr>
</table></td></tr>
<tr>
<td height="15" valign="top" bgcolor="f6f7f2"><?php //include("footer.php") ?></td>
</tr>
</table>
</body>

</html>



Thanks in advance,
Sukanya

vwphillips
02-04-2009, 04:54 PM
<script type="text/javascript">
var addInput_count = 1;
var addSec_count = 1;
function addInput() {
var c = addInput_count++;
var parent = document.getElementById('myform')
var objBr = document.createElement('br');
var objNew = document.createElement('div');
objNew.setAttribute('name', 'mod_div_' + c);
objNew.setAttribute('id', 'mod_div_' + c);
var mod_id = 'mod_div_' + c ;
var objInput1 = document.createElement('input');
objInput1.setAttribute('type', 'text');
objInput1.setAttribute('style','margin-left:50px;');
objInput1.setAttribute('name', 'module_' + c);
var objB = document.createElement('button');
objB.setAttribute('type', 'button');
objB.setAttribute('name', 'addSec');
objB.setAttribute('style', 'margin-left:5px;');
objB.setAttribute('value', c);
objB.onclick=function(){ alert("hello"); }
objB.appendChild(document.createTextNode('add sub module'));
var objC = document.createElement('button');
objC.setAttribute('type', 'button');
objC.setAttribute('name', 'remMod');
objC.setAttribute('style', 'margin-left:5px;');
objC.setAttribute('value', c);
objC.onclick=function(){ this.parentNode.parentNode.removeChild(this.parentNode); }
objC.appendChild(document.createTextNode('Remove Module'));
objNew.appendChild(document.createElement('br'));

var myText = document.createTextNode("Add Module:");
var font = document.createElement("font");
font.setAttribute('style', 'color:#000066;font-size:10px;font-weight:normal;');
font.appendChild(myText);
objNew.appendChild(font);
objNew.appendChild(objInput1);
objNew.appendChild(objB);objNew.appendChild(objC);
objNew.appendChild(document.createElement('br'));
objNew.appendChild(document.createElement('br'));
parent.appendChild(objNew);
}

krugs525
02-20-2009, 01:44 PM
Check out this link that describes the problem:

http://webbugtrack.blogspot.com/2007/10/bug-235-createelement-is-broken-in-ie.html