JSON data processing.
@{
ViewBag.Title = "Home Page";
}
<div class="row">
<div class="col-md-4">
<br/><span id="result"></span><br/>
<button id="btn-get-data">Get Data</button>
<table class="table table-striped" id="items">
<thead>
<th>#</th>
<th>A</th>
<th>B</th>
<th>Result</th>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$('#btn-get-data').click(function () {
$("#result").text("");
$("#items tbody").html("");
$.ajax({
url: "@Url.Action("CalculateData", "Home")",
method: "POST",
dataType: "json",
success: function (response) {
var responseObj = jQuery.parseJSON(response);
if (responseObj.result === 'success') {
if (responseObj.data.length > 0) {
$.each(responseObj.data, function(key, value) {
$("#items tbody").append(`<tr><td>${key + 1}.</td><td>${value.OperandA}</td><td>${value.OperandB}</td><td>${value.Result}</td></tr>`);
});
}
else {
$("#result").text('No any data.');
}
} else {
$("#result").text(responseObj.data);
}
}
});
});
});
</script>