HTML file
<div class="container">
<table id="headerTable" class="table table-bordered">
<thead>
<tr>
<th colspan="2">Header</th>
</tr>
</thead>
<tbody>
<c:forEach items="${headerList}" var="field">
<tr>
<th>${field}</th>
<td><input id="${field}" type="text" class="form-control "></td>
</tr>
</c:forEach>
</tbody>
</table>
Javascript
$('#convertBtn').click(function() {
var convertMsg = $('#msgText').val();
alert("conversion message is " + convertMsg);
$.ajax({
type: "GET",
url: "/convertMessage",
data: {
"msg": convertMsg
},
success: function(data) {
//data format looks like Object {SubsystemChannel: "F", MessageNumber: "200257", DebugQueue: " ", WorkStationNumber: "023", FrontEndNumber: "0000"…}
$('#headerTable input').each(function() {
var id = $(this).attr('id');
var field = data.id;
$(this).val(field);
});
}
});
});
My goal is to loop through the $('#headerTable input'), set the value(from the data) for each input. However, I am facing an issue with this logic. Can anyone provide assistance on this matter? Thank you in advance.