Add Row | ForDevs

Home
Blogging
Designing
- Flash
  - ActionScript 2
  - ActionScript 3
- HTML
- Javascript
- Photoshop
How-to
- What-is
Internet
- Virus
Programming
- Asp.net
- C
- C#
- DICOM
- Dot Net
- Java
  - JSP
  - Spring
- PHP
  - CakePHP
- Sql Server
  - Sql Server IQ
sql
Tech Stuff
Tools
- MS Office
- Tips And Tricks
Windows

Posts Tagged ‘Add Row’

Add a Row Dynamically using JavaScript

November 9th, 2008

admin

How to Add a Row Dynamically Using JavaScript:

We can see how button,textbox,textarea can be added Dynamically
All the tag which can be given in the input tag has to be given in setAttribute as shown in below coding
if u call a function then call as but1.onclick = function () {show(this)};
If u delete the Row,then reorder all the other row

1.If u Add a Button to a Table,then use this

var cell1 = row.insertCell(0);
but1 = document.createElement('input');
but1.setAttribute('type', 'button');
but1.setAttribute('className', 'button');
but1.setAttribute('value', '');
but1.onclick = function () {show(this)};
cell1.appendChild(but1);

2.If u Add a Textbox to a Table,then use this

 
var cell2 = row.insertCell(1);
var txt = document.createElement('input');
txt.setAttribute('type', 'text');
txt.setAttribute('name', 'firsttextbox');
txt.setAttribute('className', 'text_box');
txt.setAttribute('id', 'firsttextbox' + iteration);
txt.setAttribute('size', '21');
cell2.appendChild(txt);

3.If u Add a Textarea to a Table,then use this

cell1 = row.insertCell(1);
var e1 = document.createElement('textarea');
e1.name = 'text2' + iteration;
e1.id = 'text2' + iteration;
e1.column= '50';
cell1.appendChild(e1);

4.Row can be Re-Order by using

var tbl = delRow.parentNode.parentNode;
tbl.tBodies[0].rows[i].myRow.two.id = 'firsttextbox' + count;

If u Delete 3 Row the Reorder as
4th Row as—-3th Row
5th Row as—-4th Row
6th Row as—-5th Row

5.If u want to Delete the Third Row,then use this coding

 
var delRow = obj.parentNode.parentNode;
var rowArray = new Array(delRow);
for (var i=0; i&lt;rowObjArray.length; i++)</div>
{
  var rIndex = rowObjArray[i].sectionRowIndex;
  rowObjArray[i].parentNode.deleteRow(rIndex);
}