Win a copy of Clojure in Action this week in the Clojure forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Add & Delete Table rows dynamically

 
Dev Anand
Ranch Hand
Posts: 41
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have the following code to add and delete table rows dynamically. When i click Add button a new row is created with 'Del' button. When i press 'Del' button the respective row should get deleted. But, the next row is getting deleted. The want the appropriate row to be deleted.

I'm not able to find where it is going wrong.

Thanks in advance.

Regards
Dev Anand




-----------------------------Start Code-----------------------------------------

<script type="text/javascript">

var count=1;
function addReceiver()
{
var table1 = document.getElementById("rec_mail1");
if(count>9)
{
alert("You can send max of 10 Recipients only");
return false;
}
else
{
var rowCount = table1.rows.length;
var tableRow = table1.insertRow(rowCount);
tableRow.id="row"+count;

var ht1=window.parent.document.getElementById('ifrmgeetings').height;
ht1=parseInt(ht1);
window.parent.document.getElementById('ifrmgeetings').height=ht1+50;

var cell0= tableRow.insertCell(0);
var cell1= tableRow.insertCell(1);
var cell2= tableRow.insertCell(2);
var char= "id"+count;
var char1= "id"+count+"right";
cell0.innerHTML="<p>Receiver Name</p><p><input type=text name="+char+" id="+char+"></p>";
cell1.innerHTML="<p>Receiver Email Id</p><p><input type=text name="+char1+" id="+char1+"></p>";
cell2.innerHTML="<div class=delbut1><label><input type=button value=DEL onclick=delReceiver('"+count+"'); /></label></div> ";
count=count+1;
}
}
function delReceiver(id)
{
var tb1=document.getElementById('rec_mail1');
var lastrow=tb1.rows.length;
if(lastrow>0){
if((lastrow-1)<id)
{
var ht1=window.parent.document.getElementById('ifrmgeetings').height;
ht1=parseInt(ht1);
window.parent.document.getElementById('ifrmgeetings').height=ht1-50;
var st=id-(lastrow-1);
alert("st : "+st);
tb1.deleteRow(id-st);
count=count-1;
}
else{
alert("Id1 : "+id);
var ht1=window.parent.document.getElementById('ifrmgeetings').height;
ht1=parseInt(ht1);
window.parent.document.getElementById('ifrmgeetings').height=ht1-50;
tb1.deleteRow(id);
count=count-1;
}
}
}
</script>
---------------------------------code End------------------------------------
 
David Newton
Author
Rancher
Posts: 12617
IntelliJ IDE Ruby
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Please UseCodeTags when posting code or configuration. Unformatted code and configuration is very difficult to read. You can edit your post to include them by using the button.
 
Dev Anand
Ranch Hand
Posts: 41
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
<script type="text/javascript">

var count=1;
var count1=1;
function addReceiver()
{
var table1 = document.getElementById("rec_mail1");
if(count>9)
{
alert("You can send max of 10 Recipients only");
return false;
}
else
{
var rowCount = table1.rows.length;
var tableRow = table1.insertRow(rowCount);
tableRow.id="row"+count;

var ht1=window.parent.document.getElementById('ifrmgeetings').height;
ht1=parseInt(ht1);
window.parent.document.getElementById('ifrmgeetings').height=ht1+50;

var cell0= tableRow.insertCell(0);
var cell1= tableRow.insertCell(1);
var cell2= tableRow.insertCell(2);
var char= "id"+count;
var char1= "id"+count+"right";
cell0.innerHTML="<p>Receiver Name</p><p><input type=text name="+char+" id="+char+"></p>";
cell1.innerHTML="<p>Receiver Email Id</p><p><input type=text name="+char1+" id="+char1+"></p>";
cell2.innerHTML="<a href=\"javascript:delReceiver('"+(rowCount)+"');\">Del</a>";
//cell2.innerHTML="<div class=delbut1><label><input type=button value=DEL onclick=javascript:delReceiver('"+count+"'); /></label></div> ";
count=count+1;
}
}

function delReceiver(id)
{
var tb1=document.getElementById('rec_mail1');
var lastrow=tb1.rows.length;
if(lastrow>0)
{
if((lastrow-1)<id)
{
var ht1=window.parent.document.getElementById('ifrmgeetings').height;
ht1=parseInt(ht1);
window.parent.document.getElementById('ifrmgeetings').height=ht1-50;
var st=id-(lastrow-1);
alert("st : "+st);
tb1.deleteRow(id-st);
count=count-1;
}
else{
alert("Id1 : "+id);
var ht1=window.parent.document.getElementById('ifrmgeetings').height;
ht1=parseInt(ht1);
window.parent.document.getElementById('ifrmgeetings').height=ht1-50;
tb1.deleteRow(id);
count=count-1;
}
}
}

</script>
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64194
83
IntelliJ IDE Java jQuery Mac Mac OS X
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Without code tags, I will not look at your code.
 
Dev Anand
Ranch Hand
Posts: 41
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi David,
Thanks for your suggestion.
 
David Newton
Author
Rancher
Posts: 12617
IntelliJ IDE Ruby
  • 0
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Then I'd assume you have an off-by-one error somewhere in your code. I found it hard to read, so I took the liberty of simplifying it for you. This is untested, but probably closer to what you want, and far more maintainable (IMO):For comparison:
 
I agree. Here's the link: http://aspose.com/file-tools
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic