JSFiddle - React, Tailwind, and code Playground
HTML
<table id="scrolltable" class="table">
<thead>
<tr>
<th>Code</th>
<th>Product</th>
<th>First</th>
<th>Add</th>
<th>Qty</th>
<th>File</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr><td><input type="text" name="code" id="code1" /> </td>
<td><input type="text" name="product[]" value="" class="input-medium" id="product1" /> </td>
<td><input type="text" name="first[]" value="" class="input-small" id="first1"/></td>
<td><input type="text" name="additn[]" value="" class="input-small" id="additn1" /></td>
<td><input type="text" name="qty[]" value="" class="input-small" id="qty1" /></td>
<td><input type="file" name="oldfilename[]" value="" class="input-small" id="oldfilename1" /></td>
<td><input type="button" id="addmorePOIbutton" style="width:25px;" value="+" onClick="insRow()"/>
<input type="button" id="delPOIbutton" style="width:25px;" value="-" onClick="deleteRow(this)" disabled />
</td></tr>
</tbody>
</table>
<script>
function insRow()
{
var x=document.getElementById('scrolltable');
var new_row = x.rows[1].cloneNode(true);
var len = x.rows.length;
var code=document.getElementById('code1').value;
var product=document.getElementById('product1').value;
var first=document.getElementById('first1').value;
var additn=document.getElementById('additn1').value;
var qty=document.getElementById('qty1').value;
var oldfname=document.getElementById('oldfilename1').value;
var lastIndex = oldfname.lastIndexOf("\\");
if (lastIndex >= 0) {
oldfname = oldfname.substring(lastIndex + 1);
}
var inp1 = new_row.cells[0].getElementsByTagName('input')[0];
inp1.id += len;
inp1.value = code;
inp1.setAttribute('readonly', 'readonly');
var inp2 = new_row.cells[1].getElementsByTagName('input')[0];
inp2.id += len;
inp2.value = product;
inp2.setAttribute('readonly', 'readonly');
var inp3 =...
JavaScript
$(document).ready(function(){});