Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 07-02-2012, 01:30 PM   PM User | #1
xaverian
New Coder

 
Join Date: May 2012
Posts: 46
Thanks: 3
Thanked 0 Times in 0 Posts
xaverian is an unknown quantity at this point
Javascript not working in Internet Explorer

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.

Code:
<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>
xaverian is offline   Reply With Quote
Old 07-02-2012, 02:02 PM   PM User | #2
vwphillips
Senior Coder

 
Join Date: Mar 2005
Location: Portsmouth UK
Posts: 4,379
Thanks: 3
Thanked 466 Times in 453 Posts
vwphillips is a jewel in the roughvwphillips is a jewel in the roughvwphillips is a jewel in the rough
<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>
__________________
Vic

God Loves You and will never love you less.

http://www.vicsjavascripts.org.uk/

If my post has been useful please donate to http://www.operationsmile.org.uk/
vwphillips is offline   Reply With Quote
Old 07-02-2012, 02:05 PM   PM User | #3
vwphillips
Senior Coder

 
Join Date: Mar 2005
Location: Portsmouth UK
Posts: 4,379
Thanks: 3
Thanked 466 Times in 453 Posts
vwphillips is a jewel in the roughvwphillips is a jewel in the roughvwphillips is a jewel in the rough
Code:
<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>
__________________
Vic

God Loves You and will never love you less.

http://www.vicsjavascripts.org.uk/

If my post has been useful please donate to http://www.operationsmile.org.uk/
vwphillips is offline   Reply With Quote
Old 07-02-2012, 03:57 PM   PM User | #4
xaverian
New Coder

 
Join Date: May 2012
Posts: 46
Thanks: 3
Thanked 0 Times in 0 Posts
xaverian is an unknown quantity at this point
Thanks vwphillips.

It started working !!!
xaverian is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 11:45 PM.


Advertisement
Log in to turn off these ads.