Dom Script code not working in Opeara browser..check given code

sumanreddy

02-04-2005, 08:06 AM

hai

the following code is working in Internet Explorer, but not working in Opera. Pls Check the code and give the solution, so that it should work in Opera Browser.

<html>
<head>
<script type="text/javascript">

var i=0;

function insRow()
{
var trow=document.getElementById('myTable').insertRow()

var tdata1=trow.insertCell(0)
var tdata2=trow.insertCell(1)
var tdata3=trow.insertCell(2)
var tdata4=trow.insertCell(3)
var tdata5=trow.insertCell(4)

tdata1.innerHTML="<input type='text' id='txt' >"
tdata2.innerHTML="<input type='CHECKBOX' id='chk'>"
tdata3.innerHTML="<textarea id='tarea'></textarea>"
tdata4.innerHTML="<select id='lov'></select>"
tdata5.innerHTML="<input type='button' id='btn' onclick=delrow(this)>"

document.forms[0].elements[i].id=document.forms[0].elements[i].id+i;
document.forms[0].elements[i+1].id=document.forms[0].elements[i+1].id+i;
document.forms[0].elements[i+2].id=document.forms[0].elements[i+2].id+i;
document.forms[0].elements[i+3].id=document.forms[0].elements[i+3].id+i;
document.forms[0].elements[i+4].id=document.forms[0].elements[i+4].id+i;

tname="txt"+i;
chkname="chk"+i;
tareaname="tarea"+i;
lovname="lov"+i;
btnname="btn"+i;

tid="txt"+i;
chkid="chk"+i;
tareaid="tarea"+i;
lovid="lov"+i;
btnid="btn"+i;

var txtid = document.getElementById(tid);
txtid.setAttribute("name",tname);

var chkid = document.getElementById(chkid);
chkid.setAttribute("name",chkname);

var tareaid = document.getElementById(tareaid);
tareaid.setAttribute("name",tareaname);

var lovid = document.getElementById(lovid);
lovid.setAttribute("name",lovname);

var btnid = document.getElementById(btnid);
btnid.setAttribute("name",btnname);
btnid.setAttribute("value","delete row");
i=i+5;
}
function delrow(curr_row)
{

document.getElementById('myTable').deleteRow(curr_row.parentNode.parentNode.rowIndex);
}

</script>
</head>

<body>
<form>

<table id="myTable" border="1">
</table>

<input type="button" onclick="insRow()" value="Insert row">

</form>

</body>
</html>

hemebond

02-04-2005, 08:56 PM

Please read the posting guidelines (http://www.codingforums.com/postguide.htm) and wrap your code within code tags (http://codingforums.com/misc.php?do=bbcode#code).

Willy Duitt

02-04-2005, 09:26 PM

http://www.htmlforums.com/showthread.php?threadid=53000

Kor

02-08-2005, 09:21 AM

try using DOM level2 methods, instead of insertRow deleteRow

For instance, to insert a row with cells and inner content, you may start from using this piece of code (untested, but in theory should work). Develop it on your needs:

var innerC = new Array()
innerC[0] = ['input','text','txt'];
innerC[1] = ['input','checkbox','chk'];
innerC[2] = ['textarea','','tarea'];
innerC[3] = ['select','','lov'];
innerC[4] = ['input','button','btn'];
var root = document.getElementById('myTable');
var trow = document.createElement('tr');

for(var i=0;i<innerC.length;i++){
var tdata = document.createElement('td');
var elem = document.createElement(innerC[i][0]);
if((i!=2)||(i!=3){
elem.setAttribute('type',innerC[i][1]);
}
elem.setAttribute('id',innerC[i][2]);
if(i==4){
elem.onclick=function(){delrow(this)}
}
tdate.appendChild(elem);
trow.appendChild(tdate);
}
root.appendChild(trow);