iterate and show the json data in the existing table - jquery
up vote
0
down vote
favorite
I am getting the jsonData which i want to iterate and show in the table2 which is displayed by hiding the table1 when user click on the submit button.The table2 has many rows(6 rows) but the jsonData i'm getting has 3 rows which i want to iterate and show in the first 3 rows of the table2 and remaining rows are empty in table2 as we are getting only 3 rows information in the jsonData.
Sample Demo : http://plnkr.co/edit/OewuCrobeM2cznRgL5Lo?p=preview
Sample js code:
function submitData(){
var flag = true;
if(flag){
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{"sid":"1023","spread":"3","loanType":"auto","comments":"Loan Approved"},
{"sid":"1024","spread":"4","loanType":"car","comments":"Loan Approved"},
{"sid":"1025","spread":"3","loanType":"auto","comments":"Loan Denied"}]
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
}
}
Sample html code:
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
Note: In my case, the table is existing and i want to iterate the jsonData object and display the values in the table. But i'm finding the examples which is dynamically creating the table and displaying the JSON data in the table which i cannot use in my existing code. Any inputs would be helpful..thanks.
javascript jquery html json
add a comment |
up vote
0
down vote
favorite
I am getting the jsonData which i want to iterate and show in the table2 which is displayed by hiding the table1 when user click on the submit button.The table2 has many rows(6 rows) but the jsonData i'm getting has 3 rows which i want to iterate and show in the first 3 rows of the table2 and remaining rows are empty in table2 as we are getting only 3 rows information in the jsonData.
Sample Demo : http://plnkr.co/edit/OewuCrobeM2cznRgL5Lo?p=preview
Sample js code:
function submitData(){
var flag = true;
if(flag){
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{"sid":"1023","spread":"3","loanType":"auto","comments":"Loan Approved"},
{"sid":"1024","spread":"4","loanType":"car","comments":"Loan Approved"},
{"sid":"1025","spread":"3","loanType":"auto","comments":"Loan Denied"}]
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
}
}
Sample html code:
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
Note: In my case, the table is existing and i want to iterate the jsonData object and display the values in the table. But i'm finding the examples which is dynamically creating the table and displaying the JSON data in the table which i cannot use in my existing code. Any inputs would be helpful..thanks.
javascript jquery html json
Did you try anything? I don't see any logic to fetch the data in the code you posted.
– Busy Bee
Nov 21 at 4:21
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I am getting the jsonData which i want to iterate and show in the table2 which is displayed by hiding the table1 when user click on the submit button.The table2 has many rows(6 rows) but the jsonData i'm getting has 3 rows which i want to iterate and show in the first 3 rows of the table2 and remaining rows are empty in table2 as we are getting only 3 rows information in the jsonData.
Sample Demo : http://plnkr.co/edit/OewuCrobeM2cznRgL5Lo?p=preview
Sample js code:
function submitData(){
var flag = true;
if(flag){
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{"sid":"1023","spread":"3","loanType":"auto","comments":"Loan Approved"},
{"sid":"1024","spread":"4","loanType":"car","comments":"Loan Approved"},
{"sid":"1025","spread":"3","loanType":"auto","comments":"Loan Denied"}]
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
}
}
Sample html code:
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
Note: In my case, the table is existing and i want to iterate the jsonData object and display the values in the table. But i'm finding the examples which is dynamically creating the table and displaying the JSON data in the table which i cannot use in my existing code. Any inputs would be helpful..thanks.
javascript jquery html json
I am getting the jsonData which i want to iterate and show in the table2 which is displayed by hiding the table1 when user click on the submit button.The table2 has many rows(6 rows) but the jsonData i'm getting has 3 rows which i want to iterate and show in the first 3 rows of the table2 and remaining rows are empty in table2 as we are getting only 3 rows information in the jsonData.
Sample Demo : http://plnkr.co/edit/OewuCrobeM2cznRgL5Lo?p=preview
Sample js code:
function submitData(){
var flag = true;
if(flag){
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{"sid":"1023","spread":"3","loanType":"auto","comments":"Loan Approved"},
{"sid":"1024","spread":"4","loanType":"car","comments":"Loan Approved"},
{"sid":"1025","spread":"3","loanType":"auto","comments":"Loan Denied"}]
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
}
}
Sample html code:
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
Note: In my case, the table is existing and i want to iterate the jsonData object and display the values in the table. But i'm finding the examples which is dynamically creating the table and displaying the JSON data in the table which i cannot use in my existing code. Any inputs would be helpful..thanks.
javascript jquery html json
javascript jquery html json
asked Nov 21 at 4:07
user3684675
1161517
1161517
Did you try anything? I don't see any logic to fetch the data in the code you posted.
– Busy Bee
Nov 21 at 4:21
add a comment |
Did you try anything? I don't see any logic to fetch the data in the code you posted.
– Busy Bee
Nov 21 at 4:21
Did you try anything? I don't see any logic to fetch the data in the code you posted.
– Busy Bee
Nov 21 at 4:21
Did you try anything? I don't see any logic to fetch the data in the code you posted.
– Busy Bee
Nov 21 at 4:21
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
accepted
Since you are having a fixed table structure, you can directly iterate through jsonData
and bind the data to table using $.each
as below:
$.each(jsonData, function(key, val) {
$('#table2 tr:eq('+[key + 1]+') td:eq(0) input').val(val.sid);
$('#table2 tr:eq('+[key + 1]+') td:eq(1) input').val(val.spread);
$('#table2 tr:eq('+[key + 1]+') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq('+[key + 1]+') td:eq(3) input').val(val.comments);
});
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
accepted
Since you are having a fixed table structure, you can directly iterate through jsonData
and bind the data to table using $.each
as below:
$.each(jsonData, function(key, val) {
$('#table2 tr:eq('+[key + 1]+') td:eq(0) input').val(val.sid);
$('#table2 tr:eq('+[key + 1]+') td:eq(1) input').val(val.spread);
$('#table2 tr:eq('+[key + 1]+') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq('+[key + 1]+') td:eq(3) input').val(val.comments);
});
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
add a comment |
up vote
0
down vote
accepted
Since you are having a fixed table structure, you can directly iterate through jsonData
and bind the data to table using $.each
as below:
$.each(jsonData, function(key, val) {
$('#table2 tr:eq('+[key + 1]+') td:eq(0) input').val(val.sid);
$('#table2 tr:eq('+[key + 1]+') td:eq(1) input').val(val.spread);
$('#table2 tr:eq('+[key + 1]+') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq('+[key + 1]+') td:eq(3) input').val(val.comments);
});
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
add a comment |
up vote
0
down vote
accepted
up vote
0
down vote
accepted
Since you are having a fixed table structure, you can directly iterate through jsonData
and bind the data to table using $.each
as below:
$.each(jsonData, function(key, val) {
$('#table2 tr:eq('+[key + 1]+') td:eq(0) input').val(val.sid);
$('#table2 tr:eq('+[key + 1]+') td:eq(1) input').val(val.spread);
$('#table2 tr:eq('+[key + 1]+') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq('+[key + 1]+') td:eq(3) input').val(val.comments);
});
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
Since you are having a fixed table structure, you can directly iterate through jsonData
and bind the data to table using $.each
as below:
$.each(jsonData, function(key, val) {
$('#table2 tr:eq('+[key + 1]+') td:eq(0) input').val(val.sid);
$('#table2 tr:eq('+[key + 1]+') td:eq(1) input').val(val.spread);
$('#table2 tr:eq('+[key + 1]+') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq('+[key + 1]+') td:eq(3) input').val(val.comments);
});
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
$(document).ready(function() {
submitData = function() {
var flag = true;
if (flag) {
//after getting the values from backend hide the table1 and show table2
$("#table1").hide();
$("#table2").show();
var jsonData = [{
"sid": "1023",
"spread": "3",
"loanType": "auto",
"comments": "Loan Approved"
},
{
"sid": "1024",
"spread": "4",
"loanType": "car",
"comments": "Loan Approved"
},
{
"sid": "1025",
"spread": "3",
"loanType": "auto",
"comments": "Loan Denied"
}
];
//iterate and show the jsonData in the table2 which is shown after user click on submit button and hide the table1 and show table2
$.each(jsonData, function(key, val) {
$('#table2 tr:eq(' + [key + 1] + ') td:eq(0) input').val(val.sid);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(1) input').val(val.spread);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(2) input').val(val.loanType);
$('#table2 tr:eq(' + [key + 1] + ') td:eq(3) input').val(val.comments);
});
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table1" border="1">
<tr>
<th>SID</th>
<th>spread%</th>
<th>LoanType</th>
<th>Comments</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value="100"></td>
<td><input type="text" name="spread" id="spread1" value="6"></td>
<td><input type="text" name="loanType" id="loanType1" value="Auto"></td>
<td><input type="text" name="comments" id="comments1" value="autoLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value="200"></td>
<td><input type="text" name="spread" id="spread2" value="7"></td>
<td><input type="text" name="loanType" id="loanType2" value="Car"></td>
<td><input type="text" name="comments" id="comments2" value="carLoan"></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value="300"></td>
<td><input type="text" name="spread" id="spread3" value="6"></td>
<td><input type="text" name="loanType" id="loanType3" value="Auto"></td>
<td><input type="text" name="comments" id="comments3" value="autoLoan"></td>
</tr>
</table>
<table id="table2" border="1" style="display:none">
<tr>
<th>SIDTable2</th>
<th>spread% Table2</th>
<th>LoanType Table2</th>
<th>Comments Table2</th>
</tr>
<tr>
<td><input type="text" name="sid" id="sid1" value=""></td>
<td><input type="text" name="spread" id="spread1" value=""></td>
<td><input type="text" name="loanType" id="loanType1" value=""></td>
<td><input type="text" name="comments" id="comments1" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid2" value=""></td>
<td><input type="text" name="spread" id="spread2" value=""></td>
<td><input type="text" name="loanType" id="loanType2" value=""></td>
<td><input type="text" name="comments" id="comments2" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid3" value=""></td>
<td><input type="text" name="spread" id="spread3" value=""></td>
<td><input type="text" name="loanType" id="loanType3" value=""></td>
<td><input type="text" name="comments" id="comments31" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid4" value=""></td>
<td><input type="text" name="spread" id="spread4" value=""></td>
<td><input type="text" name="loanType" id="loanType4" value=""></td>
<td><input type="text" name="comments" id="comments4" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid5" value=""></td>
<td><input type="text" name="spread" id="spread5" value=""></td>
<td><input type="text" name="loanType" id="loanType5" value=""></td>
<td><input type="text" name="comments" id="comments5" value=""></td>
</tr>
<tr>
<td><input type="text" name="sid" id="sid6" value=""></td>
<td><input type="text" name="spread" id="spread6" value=""></td>
<td><input type="text" name="loanType" id="loanType6" value=""></td>
<td><input type="text" name="comments" id="comments6" value=""></td>
</tr>
</table>
<input type="submit" value="submit" onclick="submitData()">
answered Nov 21 at 5:04
Makarand Patil
9211612
9211612
add a comment |
add a comment |
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53405125%2fiterate-and-show-the-json-data-in-the-existing-table-jquery%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Did you try anything? I don't see any logic to fetch the data in the code you posted.
– Busy Bee
Nov 21 at 4:21