Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Deleting table rows

Posted on 2011-02-10
4
Medium Priority
?
289 Views
Last Modified: 2012-05-11
All I want to do is be able to put a delete row link on each row - it works fine at first, but if you delete an earlier row then try and delete a later one it messes up the counting - thoughts please?

var th_visible = 0;
var rowcount = 1;
var delcount = 0;

filter_added = new Array(); //define filter_added array

function add_filter() {
var the_filter = document.cs_form.filterlist.value;

// check not null
if (the_filter != 0) {

// check for headers row
if (th_visible != 1) {
document.getElementById("cs_headers").style.visibility = "visible";
th_visible = 1;
}

//if (filter_added[the_filter] != 1) {

var x=document.getElementById('cs_table').insertRow(-1);

var a=x.insertCell(0);
var b=x.insertCell(1);
var c=x.insertCell(2);
var d=x.insertCell(3);

a.innerHTML = lists[the_filter][0];
b.innerHTML = lists[the_filter][1];
c.innerHTML = lists[the_filter][2];
d.innerHTML = '<a href="#" onClick="remove_filter('+rowcount+')">X</a>';

rowcount++; //increase row count by 1

filter_added[the_filter] = 1; //set variable to identify filter

//} else { alert("Filter already added!"); } //end if filter already added

} else { alert("Please select a filter from the dropdown box"); } //end if filter not null

} //end add_filter function

function remove_filter(row) {
var x=document.getElementById('cs_table');
x.deleteRow(row-delcount);
delcount++;
return delcount;
             }

Open in new window

0
Comment
Question by:anonwig
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 34867006
Each time you delete a row, the next row take its index. So generaly you don't need to increment a counter to delete the next row.
0
 

Author Comment

by:anonwig
ID: 34867065
How do I access the rows index for putting in the delete link?
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 34867229
You may use << this >> and << parentNode >> keywords :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
	function remove_filter(mylink) {
		document.getElementById('cs_table').getElementsByTagName('tbody')[0].removeChild(mylink.parentNode.parentNode);	
	}
</script>
</head>
<body>
<table border="1" id="cs_table">
<tr><td>I'm bad news</td><td><a href="javascript:void(0)" onclick="javascript:remove_filter(this)">Delete</a></td></tr>
<tr><td>I'm bad news</td><td><a href="javascript:void(0)" onclick="javascript:remove_filter(this)">Delete</a></td></tr>
<tr><td>I'm bad news</td><td><a href="javascript:void(0)" onclick="javascript:remove_filter(this)">Delete</a></td></tr>
<tr><td>I'm bad news</td><td><a href="javascript:void(0)" onclick="javascript:remove_filter(this)">Delete</a></td></tr>
<tr><td>I'm bad news</td><td><a href="javascript:void(0)" onclick="javascript:remove_filter(this)">Delete</a></td></tr>
<tr><td>I'm bad news</td><td><a href="javascript:void(0)" onclick="javascript:remove_filter(this)">Delete</a></td></tr>
</table>
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:anonwig
ID: 34867270
Thank you - you genius
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

609 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question