Search...
FAQs
Subscribe
Pie
FAQs
Recent topics
Flagged topics
Hot topics
Best topics
Search...
Search within HTML Pages with CSS and JavaScript
Search Coderanch
Advance search
Google search
Register / Login
Post Reply
Bookmark Topic
Watch Topic
New Topic
programming forums
Java
Mobile
Certification
Databases
Caching
Books
Engineering
Micro Controllers
OS
Languages
Paradigms
IDEs
Build Tools
Frameworks
Application Servers
Open Source
This Site
Careers
Other
Pie Elite
all forums
this forum made possible by our volunteer staff, including ...
Marshals:
Campbell Ritchie
Jeanne Boyarsky
Ron McLeod
Paul Clapham
Liutauras Vilda
Sheriffs:
paul wheaton
Rob Spoor
Devaka Cooray
Saloon Keepers:
Stephan van Hulst
Tim Holloway
Carey Brown
Frits Walraven
Tim Moores
Bartenders:
Mikalai Zaikin
Forum:
HTML Pages with CSS and JavaScript
Removing a row from a table using JavaScript not working
John Zwick
Ranch Hand
Posts: 34
posted 14 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
Hi everyone, I am having trouble getting my javascript function to delete a specific row from a table. Any ideas what I am doing wrong?
here is my javascript function:
function removeRow(src) { document.getElementById("insertTable").deleteRow(src+1); }
Here is my table where there is a 'Remove' link on each row that passes the row number to the javascript function.
<table id="insertTable" width="100%"> <tr align="left"> <th width="10%">Stock ID</th> <th width="10%">Weight Class</th> <th width="10%">Language</th> <th width="10%">Bin</th> <th width="10%">Priority</th> <th width="10%">Mandate</th> <th width="10%"></th> </tr> <tr> <td width="10%"><div id="stockIDNode"><input type="text" name="stockID" maxlength="10" size="10" value="1"></div></td> <td width="10%"><div id="weightClassNode"><select name="weightClass"><option value=""></option> <option value="1">Insert Type 1</option> <option value="2">Insert Type 2</option> <option value="3">Insert Type 3</option> <option value="4">Insert Type 4</option> <option value="5">Insert Type 5</option> <option value="6" selected="selected">Insert Type 6</option> <option value="7">Insert Type 7</option> <option value="8">Insert Type 8</option></select></div></td> <td width="10%"><div id="languageNode"><select name="language"><option value=""></option> <option value="1">All</option> <option value="2" selected="selected">English</option> <option value="3">Spanish</option></select></div></td> <td width="10%"><div id="binNode"><select name="bin"><option value=""></option> <option value="1">Bin 2</option> <option value="2" selected="selected">Bin 3</option> <option value="3">Bin 4</option> <option value="4">Bin 5</option> <option value="5">Bin 6</option></select></div></td> <td width="10%"><div id="priorityNode"><select name="priority"><option value=""></option> <option value="4">High</option> <option value="2" selected="selected">Low</option> <option value="1">Lowest</option> <option value="3">Middle</option></select></div></td> <td width="10%"><div id="mandateNode"><select name="insertMandate"><option value=""></option> <option value="2" selected="selected">Mandatory</option> <option value="1">Promotional</option></select></div></td> <td width="10%"><div id="removeNode"><a href="javascript:;" onclick="removeRow(0);">Remove</a></div></td> </tr> <tr> <td width="10%"><div id="stockIDNode"><input type="text" name="stockID" maxlength="10" size="10" value="2"></div></td> <td width="10%"><div id="weightClassNode"><select name="weightClass"><option value=""></option> <option value="1">Insert Type 1</option> <option value="2">Insert Type 2</option> <option value="3">Insert Type 3</option> <option value="4" selected="selected">Insert Type 4</option> <option value="5">Insert Type 5</option> <option value="6">Insert Type 6</option> <option value="7">Insert Type 7</option> <option value="8">Insert Type 8</option></select></div></td> <td width="10%"><div id="languageNode"><select name="language"><option value=""></option> <option value="1">All</option> <option value="2" selected="selected">English</option> <option value="3">Spanish</option></select></div></td> <td width="10%"><div id="binNode"><select name="bin"><option value=""></option> <option value="1">Bin 2</option> <option value="2">Bin 3</option> <option value="3" selected="selected">Bin 4</option> <option value="4">Bin 5</option> <option value="5">Bin 6</option></select></div></td> <td width="10%"><div id="priorityNode"><select name="priority"><option value=""></option> <option value="4">High</option> <option value="2" selected="selected">Low</option> <option value="1">Lowest</option> <option value="3">Middle</option></select></div></td> <td width="10%"><div id="mandateNode"><select name="insertMandate"><option value=""></option> <option value="2" selected="selected">Mandatory</option> <option value="1">Promotional</option></select></div></td> <td width="10%"><div id="removeNode"><a href="javascript:;" onclick="removeRow(1);">Remove</a></div></td> </tr> <tr> <td width="10%"><div id="stockIDNode"><input type="text" name="stockID" maxlength="10" size="10" value="4"></div></td> <td width="10%"><div id="weightClassNode"><select name="weightClass"><option value=""></option> <option value="1">Insert Type 1</option> <option value="2">Insert Type 2</option> <option value="3">Insert Type 3</option> <option value="4">Insert Type 4</option> <option value="5">Insert Type 5</option> <option value="6">Insert Type 6</option> <option value="7">Insert Type 7</option> <option value="8" selected="selected">Insert Type 8</option></select></div></td> <td width="10%"><div id="languageNode"><select name="language"><option value=""></option> <option value="1">All</option> <option value="2">English</option> <option value="3" selected="selected">Spanish</option></select></div></td> <td width="10%"><div id="binNode"><select name="bin"><option value=""></option> <option value="1">Bin 2</option> <option value="2">Bin 3</option> <option value="3">Bin 4</option> <option value="4" selected="selected">Bin 5</option> <option value="5">Bin 6</option></select></div></td> <td width="10%"><div id="priorityNode"><select name="priority"><option value=""></option> <option value="4" selected="selected">High</option> <option value="2">Low</option> <option value="1">Lowest</option> <option value="3">Middle</option></select></div></td> <td width="10%"><div id="mandateNode"><select name="insertMandate"><option value=""></option> <option value="2">Mandatory</option> <option value="1" selected="selected">Promotional</option></select></div></td> <td width="10%"><div id="removeNode"><a href="javascript:;" onclick="removeRow(2);">Remove</a></div></td> </tr> </table>
Eric Pascarello
author
Posts: 15385
6
posted 14 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
The trouble would be, the error would be, the browser would be?
Eric
Muhammad Saifuddin
Ranch Hand
Posts: 1325
I like...
posted 14 years ago
Number of slices to send:
Optional 'thank-you' note:
Send
I just
test
your code on firefox and it works fine..
Saifuddin..
[Blog]
[Linkedin]
How To Ask Questions On JavaRanch
My OpenSource
My honeysuckle is blooming this year! Now to fertilize this tiny ad:
a bit of art, as a gift, that will fit in a stocking
https://gardener-gift.com
reply
reply
Bookmark Topic
Watch Topic
New Topic
Boost this thread!
Similar Threads
spaces while populating using s:iterator
Space not releasing on toggle of divs
how to insert multiple check box values into the database using single parameter
Resetting values of table cells in Javascript
how to take javascript array values in php form
More...