I am able to create dynamic textboxes on one button click but now the requirement is that we have to get values of that textboxes and send it to java class where I can use those values entered in the created dynamic textboxes but I am unable to do so.I have tried my best to solve this problem but I am stuck in getting values and sending it to action class.I have referred this link where umesh awasthi sir has answered but here it is for single value but how to get values from dynamically created and pass those and get it separately in action class.
Below is my javascript code :
<script>
function addFieldForDescription() {
alert("Inside Function");
var table = document.getElementById("addTable");
var tr = document.getElementById("addTables");
var a = table.rows.length;
alert(a);
var row = table.insertRow(a);
// var cell0=row.insertCell(0);
// cell0.innerHTML=a;
var input = document.createElement("input");
input.type = "text";
input.id="addDesc"+a;
input.size="40";
var br = document.createElement("br");
tr.appendChild(br);
tr.appendChild(input);
tr.appendChild(br);
}
function addFieldForAmount() {
alert("Inside Function");
var table = document.getElementById("addTable");
var tr = document.getElementById("addTables1");
var a = table.rows.length;
alert(a);
var row = table.insertRow(a);
// var cell0=row.insertCell(0);
// cell0.innerHTML=a;
var input = document.createElement("input");
input.type = "text";
input.id="addAmount"+a;
input.size="40";
var br = document.createElement("br");
tr.appendChild(br);
tr.appendChild(input);
tr.appendChild(br);
}
function submitValues()
{
alert("Inside Submit");
var amountId=document.getElementById("addTables");
alert(amountId.value);
for(var i=0;i<amountId.rows.length;i++)
{
var temp=document.getElementById("addDesc"+i);
alert(temp.value);
}
}
</script>
and below is my jsp code
<html>
<head>
</head>
<body>
<table class="responstable3" id="addTable">
<tr>
<th></th>
<th style="width: 60%;">Description <input
type="button" name="add" value="+"
onclick="addFieldForDescription()" id="addDesc0"
class="btn btn-warning" /> <input type="button"
value="Submit" onclick="submitValues()"/></th>
<th data-th="Amount"><span>Amount <input
type="button" name="add" value="+"
onclick="addFieldForAmount()" id="addAmount"
class="btn btn-warning" /></span></th>
</tr>
<tr>
<td> </td>
<td id="addTables"><input type="text" id="add" size="40" /><br></td>
<td id="addTables1"><input type="text" id="addAmount"
size="40" /><br></td>
</tr>
<tr>
<td colspan="2" style="padding: 0px;">
<table class="responstable4">
<tr>
<td style="text-align: left;">Pan No. :<input
type="text" name="invoiceVar.panNumber"
class="profarma_formtextbox1" /></td>
<td style="text-align: left;">Net Amount :</td>
</tr>
<tr>
<td style="text-align: left;">Service Tax No. :<input
type="text" name="invoiceVar.serviceTaxNumber"
class="profarma_formtextbox1" /></td>
<td style="text-align: left;">Service Tax @ 14.00%</td>
</tr>
<tr>
<td style="text-align: left;"></td>
<td style="text-align: left;">SBC @ 0.50%</td>
</tr>
<tr>
<td style="text-align: left;"></td>
<td style="text-align: left;">Total Amount</td>
</tr>
</table>
</td>
<td style="padding: 0px;">
<div ng-app>
<table class="responstable4">
<tr>
<td><input type="text" name="invoiceVar.netAmount"
class="profarma_formtextbox2" ng-model="a" /></td>
</tr>
<tr>
<td><input type="text" name="invoiceVar.serviceTax"
class="profarma_formtextbox2" value="{{a*0.14}}" /></td>
</tr>
<tr>
<td><input type="text" name="invoiceVar.sbcTax"
class="profarma_formtextbox2" value="{{a*0.005}}" /></td>
</tr>
<tr>
<td><input type="text"
name="invoiceVar.invoiceTotalAmount"
class="profarma_formtextbox2"
value="{{a--(a*0.14)--(a*0.005)}}" /></td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td colspan="3" style="text-align: left;">Total Amount in
Words :</td>
</tr>
</table>
</body>
</html>[![error][2]][2]
and here it is how it looks like.yellow plus button will add textboxes in description and amount column and I have to call those values in action class. Any help would be greatly appreciated .thank you :)
