...

View Full Version : Javascript not working in Internet Explorer



xaverian
07-02-2012, 02:30 PM
Hi ,

I am running this following html and javascript . Please check that after clicking on "Add Condition" button, a new row is added for adding more conditions alongwith a "Rem. cond." button at the rightmost side of that added row for removing the row.

Problem is that "Rem. cond." button is working fine in Firefox but not in Internet Explorer. Please help me to get this working in both the browsers.

Something must be going wrong in the removeRowFromTable function. Please help.

Thanks.


<html>
<title>query builder </title>
<table border="0" id="tblSample" align=center>
<tr>
<th colspan="7" class=teamlevel height=17>The conditions that the result should match </th>
</tr>

<tr id="RmC_1"><td width=5%>&nbsp;</td><td ><select name='OPENBRACK1'><option
value=''></option><option value='('>(</option></td><td><select name='FIELD1'><option
value='view'>View Name</option><option value='path'>Path</option></select>
</td>

<td><select name='COMP1'><option value='='>=</option><option
value='!='>!=</option></select> </td>
<td><input type=text name='VALUE1' maxlength=40 size=30 value=''></td><td ><select name='CLOSEBRACK1'><option value=''></option><option value=')'>)</option></td><td >&nbsp;</td>
</tr>
<tr>

<td colspan=7 align=center>
<input type='hidden' name='NoOfRows' value="1" />
<input type="button" value="Add Condition" onclick="addRowToTable()" name="AddCondition" />
</td>
</tr>

</table>
<script type= "text/javascript">

function addRowToTable() {

var tbl = document.getElementById('tblSample');
var lastRow = (tbl.rows.length -1);

//if there's no header row in the table,then iteration = lastrow +1
var iteration = lastRow;
var row = tbl.insertRow(lastRow);

var newCell = row.insertCell(0);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'ANDOR' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("AND");
oOption.setAttribute("value", 'AND');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("OR");
oOption1.setAttribute("value", 'OR');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(1);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'OPENBRACK' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("");
oOption.setAttribute("value", '');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("(");
oOption1.setAttribute("value", '(');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(2);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'FIELD' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("View Name");
oOption.setAttribute("value", 'view');
oOption.appendChild(t);
oSelect.appendChild(oOption);

var oOption = document.createElement("OPTION");
var t = document.createTextNode("Path");
oOption.setAttribute("value", 'path');
oOption.appendChild(t);
oSelect.appendChild(oOption);

newCell.appendChild(oSelect);

var newCell = row.insertCell(3);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'COMP' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("=");
oOption.setAttribute("value", '=');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("!=");
oOption1.setAttribute("value", '!=');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

// right cell
var cellRight = row.insertCell(4);
var el = document.createElement('input');
el.setAttribute('type', 'text');
el.setAttribute('name', 'VALUE' + iteration);
el.setAttribute('id', 'txtRow' + iteration);
el.setAttribute('size', '30');
el.setAttribute('maxlength', '40');
cellRight.appendChild(el);

var newCell = row.insertCell(5);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'CLOSEBRACK' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("");
oOption.setAttribute("value", '');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode(")");
oOption1.setAttribute("value", ')');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(6);
var elb = document.createElement('input');
elb.setAttribute('type', 'button');
elb.setAttribute('name', 'RmC_' + iteration);
//elb.setAttribute('value', 'Rem. cond.' + iteration);
elb.setAttribute('value', 'Rem. cond.');
elb.setAttribute('onclick', 'removeRowFromTable("RmC_' + iteration + '");');
elb.setAttribute('id', 'RmC_' + iteration);
//elb.setAttribute('size', '30');
//elb.setAttribute('maxlength', '40');
newCell.appendChild(elb);
document.query.NoOfRows.value = parseInt(document.query.NoOfRows.value) + 1;



}



function removeRowFromTable(rmid) {


var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
var removed = 0 ;
for(var i=2; i<lastRow - 1; i++)
{
var lastCol = tbl.rows[i].cells[6].childNodes[0].name ;
if ((lastCol != undefined)&&(lastCol == rmid))
{
//alert('rmid:' + rmid + '\n' + 'last:' + lastCol) ;
tbl.deleteRow(i);
removed = i ;
break ;
}
}
if (removed < lastRow-2)
{
var reg = /(\D+)(\d+)/ ;
for(var i=removed ; i<lastRow - 2; i++)
{
for (var j=0;j<=6;j++)
{
var col = tbl.rows[i].cells[j].childNodes[0].name;
var arry = reg.exec(col) ;
var newnum = parseInt(arry[2]) - 1 ;
var necol = arry[1] + newnum ;
tbl.rows[i].cells[j].childNodes[0].setAttribute('name', necol) ;
if (j == 6)
{
tbl.rows[i].cells[j].childNodes[0].setAttribute('onclick', 'removeRowFromTable("' + necol + '");') ;
}
//alert('reg:' + reg + '\n' + 'arry[0]:' + arry[0] + 'arry[1]:' + arry[1] + 'arry[2]:' + arry[2] + '\n' + 'necol:' + necol ) ;
}
//alert( 'removed:' + removed + '\n' + 'Last:' + lastRow + '\n\n' + 'Shift:' + i ) ;
}
}
else
{
//alert('No shifting needed!!\n' + 'removed:' + removed + '\n' + 'Last:' + lastRow) ;
}
//Element.remove(rmid) ;
if (lastRow > 3) {
//tbl.deleteRow(lastRow - 2);
document.query.NoOfRows.value = parseInt(document.query.NoOfRows.value) - 1;
}


}





</script>


</html>

vwphillips
07-02-2012, 03:02 PM
<html>
<title>query builder </title>
<form name="query" >
<table border="0" id="tblSample" align=center>
<tr>
<th colspan="7" class=teamlevel height=17>The conditions that the result should match </th>
</tr>

<tr id="RmC_1"><td width=5%>&nbsp;</td><td ><select name='OPENBRACK1'><option
value=''></option><option value='('>(</option></td><td><select name='FIELD1'><option
value='view'>View Name</option><option value='path'>Path</option></select>
</td>

<td><select name='COMP1'><option value='='>=</option><option
value='!='>!=</option></select> </td>
<td><input type=text name='VALUE1' maxlength=40 size=30 value=''></td><td ><select name='CLOSEBRACK1'><option value=''></option><option value=')'>)</option></td><td >&nbsp;</td>
</tr>
<tr>

<td colspan=7 align=center>
<input type='hidden' name='NoOfRows' value="1" />
<input type="button" value="Add Condition" onclick="addRowToTable()" name="AddCondition" />
</td>
</tr>

</table>
</form>
<script type= "text/javascript">

function addRowToTable() {

var tbl = document.getElementById('tblSample');
var lastRow = (tbl.rows.length -1);

//if there's no header row in the table,then iteration = lastrow +1
var iteration = lastRow;
var row = tbl.insertRow(lastRow);

var newCell = row.insertCell(0);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'ANDOR' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("AND");
oOption.setAttribute("value", 'AND');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("OR");
oOption1.setAttribute("value", 'OR');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(1);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'OPENBRACK' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("");
oOption.setAttribute("value", '');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("(");
oOption1.setAttribute("value", '(');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(2);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'FIELD' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("View Name");
oOption.setAttribute("value", 'view');
oOption.appendChild(t);
oSelect.appendChild(oOption);

var oOption = document.createElement("OPTION");
var t = document.createTextNode("Path");
oOption.setAttribute("value", 'path');
oOption.appendChild(t);
oSelect.appendChild(oOption);

newCell.appendChild(oSelect);

var newCell = row.insertCell(3);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'COMP' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("=");
oOption.setAttribute("value", '=');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("!=");
oOption1.setAttribute("value", '!=');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

// right cell
var cellRight = row.insertCell(4);
var el = document.createElement('input');
el.setAttribute('type', 'text');
el.setAttribute('name', 'VALUE' + iteration);
el.setAttribute('id', 'txtRow' + iteration);
el.setAttribute('size', '30');
el.setAttribute('maxlength', '40');
cellRight.appendChild(el);

var newCell = row.insertCell(5);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'CLOSEBRACK' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("");
oOption.setAttribute("value", '');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode(")");
oOption1.setAttribute("value", ')');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(6);
var elb = document.createElement('input');
elb.setAttribute('type', 'button');
elb.setAttribute('name', 'RmC_' + iteration);
//elb.setAttribute('value', 'Rem. cond.' + iteration);
elb.setAttribute('value', 'Rem. cond.');
elb.onclick=function(){ removeRowFromTable(this); };
elb.setAttribute('id', 'RmC_' + iteration);
//elb.setAttribute('size', '30');
//elb.setAttribute('maxlength', '40');
newCell.appendChild(elb);
document.query.NoOfRows.value = parseInt(document.query.NoOfRows.value) + 1;



}



function removeRowFromTable(obj) {

var rmid=obj.id
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
var removed = 0 ;
for(var i=2; i<lastRow - 1; i++)
{
var lastCol = tbl.rows[i].cells[6].childNodes[0].name ;
if ((lastCol != undefined)&&(lastCol == rmid))
{
//alert('rmid:' + rmid + '\n' + 'last:' + lastCol) ;
tbl.deleteRow(i);
removed = i ;
break ;
}
}
if (removed < lastRow-2)
{
var reg = /(\D+)(\d+)/ ;
for(var i=removed ; i<lastRow - 2; i++)
{
for (var j=0;j<=6;j++)
{
var col = tbl.rows[i].cells[j].childNodes[0].name;
var arry = reg.exec(col) ;
var newnum = parseInt(arry[2]) - 1 ;
var necol = arry[1] + newnum ;
tbl.rows[i].cells[j].childNodes[0].setAttribute('name', necol) ;
if (j == 6)
{
tbl.rows[i].cells[j].childNodes[0].setAttribute('onclick', 'removeRowFromTable("' + necol + '");') ;
}
//alert('reg:' + reg + '\n' + 'arry[0]:' + arry[0] + 'arry[1]:' + arry[1] + 'arry[2]:' + arry[2] + '\n' + 'necol:' + necol ) ;
}
//alert( 'removed:' + removed + '\n' + 'Last:' + lastRow + '\n\n' + 'Shift:' + i ) ;
}
}
else
{
//alert('No shifting needed!!\n' + 'removed:' + removed + '\n' + 'Last:' + lastRow) ;
}
//Element.remove(rmid) ;
if (lastRow > 3) {
//tbl.deleteRow(lastRow - 2);
document.query.NoOfRows.value = parseInt(document.query.NoOfRows.value) - 1;
}


}





</script>


</html>

vwphillips
07-02-2012, 03:05 PM
<html>
<title>query builder </title>
<form name="query" >
<table border="0" id="tblSample" align=center>
<tr>
<th colspan="7" class=teamlevel height=17>The conditions that the result should match </th>
</tr>

<tr id="RmC_1"><td width=5%>&nbsp;</td><td ><select name='OPENBRACK1'><option
value=''></option><option value='('>(</option></td><td><select name='FIELD1'><option
value='view'>View Name</option><option value='path'>Path</option></select>
</td>

<td><select name='COMP1'><option value='='>=</option><option
value='!='>!=</option></select> </td>
<td><input type=text name='VALUE1' maxlength=40 size=30 value=''></td><td ><select name='CLOSEBRACK1'><option value=''></option><option value=')'>)</option></td><td >&nbsp;</td>
</tr>
<tr>

<td colspan=7 align=center>
<input type='hidden' name='NoOfRows' value="1" />
<input type="button" value="Add Condition" onclick="addRowToTable()" name="AddCondition" />
</td>
</tr>

</table>
</form>
<script type= "text/javascript">

function addRowToTable() {

var tbl = document.getElementById('tblSample');
var lastRow = (tbl.rows.length -1);

//if there's no header row in the table,then iteration = lastrow +1
var iteration = lastRow;
var row = tbl.insertRow(lastRow);

var newCell = row.insertCell(0);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'ANDOR' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("AND");
oOption.setAttribute("value", 'AND');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("OR");
oOption1.setAttribute("value", 'OR');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(1);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'OPENBRACK' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("");
oOption.setAttribute("value", '');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("(");
oOption1.setAttribute("value", '(');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(2);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'FIELD' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("View Name");
oOption.setAttribute("value", 'view');
oOption.appendChild(t);
oSelect.appendChild(oOption);

var oOption = document.createElement("OPTION");
var t = document.createTextNode("Path");
oOption.setAttribute("value", 'path');
oOption.appendChild(t);
oSelect.appendChild(oOption);

newCell.appendChild(oSelect);

var newCell = row.insertCell(3);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'COMP' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("=");
oOption.setAttribute("value", '=');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode("!=");
oOption1.setAttribute("value", '!=');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

// right cell
var cellRight = row.insertCell(4);
var el = document.createElement('input');
el.setAttribute('type', 'text');
el.setAttribute('name', 'VALUE' + iteration);
el.setAttribute('id', 'txtRow' + iteration);
el.setAttribute('size', '30');
el.setAttribute('maxlength', '40');
cellRight.appendChild(el);

var newCell = row.insertCell(5);
var oSelect = document.createElement("select");
oSelect.setAttribute('name', 'CLOSEBRACK' + iteration);
var oOption = document.createElement("OPTION");
var t = document.createTextNode("");
oOption.setAttribute("value", '');
oOption.appendChild(t);
oSelect.appendChild(oOption);
var oOption1 = document.createElement("OPTION");
var t = document.createTextNode(")");
oOption1.setAttribute("value", ')');
oOption1.appendChild(t);
oSelect.appendChild(oOption1);
newCell.appendChild(oSelect);

var newCell = row.insertCell(6);
var elb = document.createElement('input');
elb.setAttribute('type', 'button');
elb.setAttribute('name', 'RmC_' + iteration);
//elb.setAttribute('value', 'Rem. cond.' + iteration);
elb.setAttribute('value', 'Rem. cond.');
elb.onclick=function(){ removeRowFromTable(this); };
elb.setAttribute('id', 'RmC_' + iteration);
//elb.setAttribute('size', '30');
//elb.setAttribute('maxlength', '40');
newCell.appendChild(elb);
document.query.NoOfRows.value = parseInt(document.query.NoOfRows.value) + 1;



}



function removeRowFromTable(obj) {

var rmid=obj.id
var tbl = document.getElementById('tblSample');
var lastRow = tbl.rows.length;
var removed = 0 ;
for(var i=2; i<lastRow - 1; i++)
{
var lastCol = tbl.rows[i].cells[6].childNodes[0].name ;
if ((lastCol != undefined)&&(lastCol == rmid))
{
//alert('rmid:' + rmid + '\n' + 'last:' + lastCol) ;
tbl.deleteRow(i);
removed = i ;
break ;
}
}
if (removed < lastRow-2)
{
var reg = /(\D+)(\d+)/ ;
for(var i=removed ; i<lastRow - 2; i++)
{
for (var j=0;j<=6;j++)
{
var col = tbl.rows[i].cells[j].childNodes[0].name;
var arry = reg.exec(col) ;
var newnum = parseInt(arry[2]) - 1 ;
var necol = arry[1] + newnum ;
tbl.rows[i].cells[j].childNodes[0].setAttribute('name', necol) ;
if (j == 6)
{
tbl.rows[i].cells[j].childNodes[0].setAttribute('onclick', 'removeRowFromTable("' + necol + '");') ;
}
//alert('reg:' + reg + '\n' + 'arry[0]:' + arry[0] + 'arry[1]:' + arry[1] + 'arry[2]:' + arry[2] + '\n' + 'necol:' + necol ) ;
}
//alert( 'removed:' + removed + '\n' + 'Last:' + lastRow + '\n\n' + 'Shift:' + i ) ;
}
}
else
{
//alert('No shifting needed!!\n' + 'removed:' + removed + '\n' + 'Last:' + lastRow) ;
}
//Element.remove(rmid) ;
if (lastRow > 3) {
//tbl.deleteRow(lastRow - 2);
document.query.NoOfRows.value = parseInt(document.query.NoOfRows.value) - 1;
}


}





</script>


</html>

xaverian
07-02-2012, 04:57 PM
Thanks vwphillips.

It started working !!!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum