add remove field in java script
- by rajanikant
Hi every body. i want to add and remove some html input in javascript
i have done for add function . it work properly. but unable to remove. my code is following
fields = 1;
function addInput() {
if (fields != 10) {
document.getElementById('text').innerHTML += "<tr><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='date[]' id='date[]' /></td><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='time[]' id='time[]' /></td><td width='20%' align='left' valign='top' class='subheading'><input type='text' name='module[]' id='module[]' /></td><td width='15%' align='left' valign='top' class='subheading'><input type='text' name='organisation[]' id='organisation[]' /></td><td width='20%' align='left' valign='top' class='subheading' nowrap='nowrap'><input type='text' name='category[]' id='category[]' /></td><td width='20%' align='left' valign='top' class='text' nowrap='nowrap'>Add | Remove </td></tr>";
fields += 1;
} else {
document.getElementById('text').innerHTML += "<br />Only 10 upload fields allowed.";
document.form.add.disabled=true;
}
}
fields1=10
function removeInput() {
if (fields1 !=1) {
document.getElementById('text').innerHTML += "";
fields -= 1;
}
}
and my php function is
function addSession()
{?>
<table cellpadding="5" cellspacing="0" width="100%">
<tr>
<td width="10%" align="left" valign="top" colspan="6" bgcolor="#993333" class="heading">Add Session </span></td>
</tr><tr class="bgrow">
<td width="10%" align="left" valign="top" class="subheading">Datum </span></td>
<td width="20%" align="left" valign="top" class="subheading">Tijd</td>
<td width="35%" align="left" valign="top" class="subheading">Module</td>
<td width="15%" align="left" valign="top" class="subheading">Organisatie</td>
<td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap">Category</td>
<td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap">Action</td>
</tr>
<tr >
<td width="15%" align="left" valign="top" class="subheading"><input type="text" name="date_0" id="date_0" /></td>
<td width="15%" align="left" valign="top" class="subheading"><input type="text" name="time_0" id="time_0" /></td>
<td width="20%" align="left" valign="top" class="subheading"><input type="text" name="module_0" id="module_0" /></td>
<td width="15%" align="left" valign="top" class="subheading"><input type="text" name="organisation_o" id="organisation_o" /></td>
<td width="20%" align="left" valign="top" class="subheading" nowrap="nowrap"><input type="text" name="cat_0" id="cat_0" /></td>
<td width="20%" align="left" valign="top" class="text" nowrap="nowrap"><span onclick="addInput()" class="link">Add</span> | <span onclick="removeInput()" class="link">Remove </span></td>
</tr>
<tbody id="text">
</tbody>
<?php
}
?>
can any one give me solution?
