<!DOCTYPE HTML>
<html>
<head>
<title>Spring Boot - DELETE-UPDATE AJAX Example</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
</head>
<body>
<div class="container">
<h1>JOPA</h1>
<div class="row col-md-7 table-responsive">
<table id="customerTable" class="table table-bordered table-hover">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Price</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</body>
<script>
$(document).ready(function() {
ajaxGet();
// DO GET
function ajaxGet(){
var customerRow = '';
$.ajax({
type : "GET",
url : window.location + "/wey/all",
success: function(result){
$.each(result, function(i, quotation){
customerRow = '<tr>' +
'<td>' + quotation.id + '</td>' +
'<td>' + quotation.name.toUpperCase() + '</td>' +
'<td>' + quotation.price + '</td>' +
'</tr>';
$('#customerTable tbody').append(customerRow);
});
$( "#customerTable tbody tr:odd" ).addClass("info");
$( "#customerTable tbody tr:even" ).addClass("success");
},
error : function(e) {
alert("ERROR: ", e);
console.log("ERROR: ", e);
}
});
}
setInterval(ajaxGet,3000);
})
</script>
</html>
