<%@page contentType="text/html" pageEncoding="UTF-8"%>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<input type="button" id="button1" value="Submit">
<div class="total-comments"></div>
<div class="allcomments">
</div>
<script>
$("#button1").click(function() {
$.getJSON('fetchComments', function(data) {
$(".total-comments").html("<h2>Total comments are "+data.totalComments+"</div>");
var msg;
$.each(data.commentList, function(j) {
msg='<div class="comment">';
msg+= '<div class="id">'+data.commentList[j].id+'</div>'
msg+= '<div class="name">'+data.commentList[j].name+'</div>';
msg+= '<div class="image">'+data.commentList[j].pic+'</div>'
msg+= '<div class="image">'+data.commentList[j].comment+'</div>'
msg+= '<div class="commentDate">'+data.commentList[j].commentDate+'</div>'
msg+='</div>';
$(".allcomments").append(msg);
});
return false;
});
});
</script>