I'm trying to make a comment section for my site. After a comment has been posted I would like to show it immediately instead of being forced to reload the page. So I need to somehow be able to create div and other elements and later fill them with the relevant data.
$(document).ready(function () {
$(".commentAnswer").keypress(function (e) {
if (e.which == 13) {
var commentData = { Value: ($(input).attr("data-answerId")),
Description: ($(input).attr("value"))
};
$.ajax({
type: "POST",
url: '@Url.Action("SubmitComment", "Home")',
data: JSON.stringify(commentData),
dataType: "json",
contentType: 'application/json, charset=utf-8',
traditional: true,
success: function (data) {
//create elements.
}
});
}
});
This the block I want to create.
<div class="commentContent">
<div class="comment">@comment.Comment.Text</div>
<ul>
<li>
<div class="newsTime">@comment.User.FirstName @comment.User.LastName</div>
</li>
<li>- </li>
<li>
<div class="newsTime">
@foreach (var role in comment.CommenterRoles) {
if (role.Role.Equals("Authenticated") || role.Role.Equals("Administrator")) {
//Don't write anything
} else {
@role.Role@:.
}
}
</div>
</li>
<li>- </li>
<li>
<div class="newsTime">
@Project.Tools.TimeTool.ToTimeSinceString(comment.Comment.SubmitDateTime)
</div>
</li>
</ul>
</div>
<hr />