ArticlesLinksMake a PayPal Contribution to remove CopyWrite notices!
|
Dynamic Tables with DOMAfter doing the usual searches on the net I was surprised to find I could not get an existing script that could add and delete rows dynamically.....well the way I wanted anyway. This is my first attempt at manipulating tables using dom and have put together this script from code I've dug up from other sites and forum searches.
Basically by clicking the + or - buttons will either add or delete the selected row. Hopefully this script will be found useful to you and if so please post a comment below. Script is available by viewing the source code.
09-November, 2007 Update:Script is now an external js file "tabledom.js".Form element names are now appended in descending order whenever a table row is added or deleted. Click the submit button to see the result display. CommentsWill: Hi badotz.
- No, the line is correct, the statement is actually evaluating wether theCell.parentNode is an object....not if cell equates to theCell.parentNode. Nicolae Mogoreanu: WTF. I've spent 5 minutes searching for the link to download the .js file. Or you expect us to view page source and extract the code? Phill: Is this compatible with asp.net 2.0 phill: Managed to get it working in asp.net 2.0 Creates clones - however when I click on the '-' button I get a message saying that I cannot remove the first row (when there are two rows present) Will: The script is client-side Javascript, so it runs in a browser and is compatible with any server-side language.
-
- It is set to not allow remove first row otherwise you would have to refresh the page to retrieve it. All rows under the first can be added/deleted. phill: Sorry I did not explain properly. I cloned the row so that there were two identical rows but it would not let me remove the cloned row. I am guessing it has something to do with the initialisation of the number counter Will: If your implementation does not let you delete a newly created row then there is possibly a mis-coding in the way you have implemented it. The script increments the elements name attribute when a new element(input) is added. Make sure you don't have space in the element/s name. See: function updateName(oName). If you are happy to allow deletion of all rows you could modify function deleteRow(theCell). I can take a look,drop me an email. Markus Boc: > Nicolae Mogoreanu: WTF. I've spent
- > 5 minutes searching for the link
- > to download the .js file. Or you
- > expect us to view page source and
- > extract the code?
-
- You're an idiot, it's obvious how to get to the file. If it took you 5min to get your FREE code, maybe you should stop programming. Troy Compton: This is a great exampleWhere is the file tabledom.js? I didnt see it. Thanks Will: Thanx Troy,
- http://www.coastworx.com/tabledom.js Matt: Great piece of code Will.
- Well done Matt: Hi Will
-
- Can you please post your results.php file?
-
- Thanks. Will: Matt, the results page is php by extension only...the results are parsed in this example using javascript: view the source code of results.php to get the code and save it as results.html.
- Set the forms action to results.html. Will: Update: Forms action is now results.html and some demo data included to the form Matt: Thanks Will 15 of 20 comments (part 1) [ » ] [ * ]
|