Add A Row. - HTML / Javascript Tutorials
 
  Buy Ebooks, Video Games, DVDs, Electronics and more !
Home | Help Forums | Web Design Tutorials | Free Swishmax Downloads Make Money Online Blog . Free Image and Photo Sharing and Hosting

 

 

Company

Home

Nework Details

Tutorials

SWiSH 2

SWiSHMax

Flash MX

PHP & MySQL

HTML / JScript

Adobe Photoshop

Corel Draw

Gimp

Miscellaneous

Downloads

Templates

Plugins

Fonts

Wallpapers

Free Images

Scripts and Codes

Products

E-Books

SWiSH BB

SWiSH Templates

SWiSH-DB Newsletter
Subscribe to our newsletter : GO
  Partners / Affiliates

   Free image hosting
   Web Design Pakistan
   Swish Templates
   SWiSH Climax
   Talkfreelance Community
   Template Desire
   Lite boards
   Script Sector
   GimpTalk
   13dots
   Idea Designs
   PHP Cafe
   Sposatoettore
   Free swishmax templates
   Swishzone

Manage your site with Flax Article Content Management System
Add A Row.
Category : HTML / Javascript | Level : Beginner | Language : English
Ask Question | Read Comments | Post tutorial | Previous | Next

Web www.swish-db.com

This is one sweet thing i found out how to do, thanks to javacript source!!!!!




Ok, i'm going to teach you all in my own words biggrin.gif


Step1: Open Notepad or a WYSIWYG html editor smile.gif

If notepad, just type this:

CODE
<html>
<head>
<title>JAMIE RULES</title>
</head>
<body>

</body>
</html>
<< Just done that quickly, shouldn't be any errors smile.gif

Ok, now the fun part, you see the area "<head>", well insert this code:

CODE
<script LANGUAGE="JavaScript">
<!-- Begin
 function addRow(id){
   var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
   var row = document.createElement("TR")
   var td1 = document.createElement("TD")
   td1.appendChild(document.createTextNode("column 1"))
   var td2 = document.createElement("TD")
   td2.appendChild (document.createTextNode("column 2"))
   row.appendChild(td1);
   row.appendChild(td2);
   tbody.appendChild(row);
 }
//  End -->
</script>


So, it should look something like this:

CODE
<html>

<head>
<script LANGUAGE="JavaScript">
<!-- Begin
 function addRow(id){
   var tbody = document.getElementById
(id).getElementsByTagName("TBODY")[0];
   var row = document.createElement("TR")
   var td1 = document.createElement("TD")
   td1.appendChild(document.createTextNode("column 1"))
   var td2 = document.createElement("TD")
   td2.appendChild (document.createTextNode("column 2"))
   row.appendChild(td1);
   row.appendChild(td2);
   tbody.appendChild(row);
 }
//  End -->
</script>
<< Should be correct, hunt me down if it isn't tongue.gif

Ok, all that is doing is telling it to add how many rows and where to add them, basically the maths of it, you dont need to worry about it!!


Now, the second fun part, look for "<body>"

And insert this:

CODE
<a href="javascript:addRow('table')">Add A Row</a><br><hr>

<table id="table" cellspacing="0" border="1">
 <tbody>
   <tr>
     <td>row1_column1</td><td>row1_column1</td>
   </tr>
 </tbody>
</table>


So, you're working with something similar to this:

CODE
<body><a href="javascript:addRow('table')">Add A Row</a>

<table id="table" cellspacing="0" border="1">
 <tbody>
   <tr>
     <td>row1_column1</td><td>row1_column1</td>
   </tr>
 </tbody>
</table>


</body>


NOT ROCKET SCIENCE NOW IS IT cool.gif cool.gif

Ok, its finished! Yup, too quick, and i bet you haven't got a clue what it does tongue.gif

Just go ahead and try it! smile.gif


Here is an example of what it does smile.gif

http://www.host-media.co.uk/addtable.htm

Enjoy!

Any problems let me know, you can do allsorts, add 3 rows at once, add many rows at once with a single click! smile.gif

I'll also add a tutorial how to remove the added rows for you all wink.gif


Okay, time i went and got some Dinner. Cya all in a few hours smile.gif




Jamie smile.gif
Regards...


© 2002-2005 Flaxweb Network | Article Manager | Gimp Tutorials Library | RAD C++ Library | Free C/C++ Sourcecode |
Sites of interest : Web Design Blog | Swish Templates | Swishmax Ebook | Photoshop Templates | Gimp Tutorials | Text Forum | Make Money Online