Javascript – Add/Remove table rows

<TITLE> Javascript – Add/Remove table rows </TITLE>
<META NAME=”Keywords” CONTENT=””>
<META NAME=”Description” CONTENT=””>
<style type=”text/css”>
body, table, td, p {
font-family: Trebuchet MS, Tahoma;
font-size: 12px;
<script language=”javascript” type=”text/javascript”>
function addRow() {
var visi_insertrowid = parseInt(document.getElementById(‘hid_visiblefields_index’).value);
var visi_lastrowvalue = parseInt(document.getElementById(‘hid_visiblefields_value’).value);
var _table = document.getElementById(‘tbl_visiblefields’).insertRow(visi_insertrowid);
var cell0 = _table.insertCell(0);
var cell1 = _table.insertCell(1);
cell0.innerHTML = ‘<input type=”file” name=”txt_pictures[]”>’;
cell1.innerHTML = ‘<a href=”javascript:void(0);” onClick=”javascript:return removeRow(this);”>Remove</a>’;
document.getElementById(‘hid_visiblefields_index’).value = visi_insertrowid +1;
document.getElementById(‘hid_visiblefields_value’).value = visi_lastrowvalue+1;
return false;

function removeRow(rows) {
var browsername = navigator.appName;
var _row = rows.parentElement.parentElement;
var _row = rows.parentNode.parentNode;
document.getElementById(‘hid_visiblefields_index’).value = parseInt(document.getElementById(‘hid_visiblefields_index’).value) – 1;
return false;
<TABLE border=”0″ cellpadding=”0″ cellspacing=”0″ width=”100%” height=”100%”>
<TD align=”center”>
<form name=”frmTest” id=”” action=”” method=”post”>
<input type=”hidden” name=”hid_visiblefields_index” id=”hid_visiblefields_index” value=”1″>
<input type=”hidden” name=”hid_visiblefields_value” id=”hid_visiblefields_value” value=”0″>
<table border=”0″ cellpadding=”0″ cellspacing=”5″>
<td width=”100″>Name</td>
<td width=”30″ align=”center”>:</td>
<td><input type=”text” name=”txt_name” style=”width:100px;”></td>
<td align=”center”>:</td>
<table border=”0″ cellpadding=”0″ cellspacing=”5″ id=”tbl_visiblefields”>
<td><input type=”file” name=”txt_pictures[]”></td>
<td><a href=”javascript:void(0);” onClick=”javascript:return addRow(this);”>Add</a></td>


Download code: Click here


About selvam4win

I am Selvam. I am very jolly person and frank one.

Posted on July 21, 2010, in Dynamic TR add/remove, javascript, PHP, Uncategorized. Bookmark the permalink. 1 Comment.

  1. The script is not working.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: