April 22, 2012
unable to create multiple div inside div dynamically
Question by prerna
$.post("../../Handler/Topic.ashx",
{ commentclob: commentClob,
commenttitle: commentTitle,
topicId: id,
Button: buttoname },
function (data) {
obj = jQuery.parseJSON(data);
var $table = $('<table/>').addClass('commentbox');
$table.append('<tr><td>' +
'Comment Id:' +
obj.CommentId +
'</td></tr>');
var includeReply = "<input type='button'
class='btnReply'
value='Reply'
id='btnReply-" + obj.CommentId + "' />";
$("#commentContainer").prepend(
$('<div/>').attr('id', '#comment-' + obj.CommentId)
.append($table)
);
//This doesnt work
$("#comment-" + obj.CommentId).append(
$('<div/>').attr('id', '#container-' + obj.CommentId)
.append(includeReply)
);
});
html
<div id="commentContainer"></div>
I am successfully able to append div with #comment-id to comment-container but I am unable to append another div inside #comment-id.
I have tried
var str = $("<div>").attr("id", "#container-" + obj.CommentId)
$(str).append(includeReply);
$table.append('<tr><td>' + 'CommentDiv:' + str + '</td></tr>');
But it gives
CommentDiv:[object object]
Answer by Starx
str is an HTML object so it can concatenated like that. You have to extract the markup with .html() and then concatenate it.
var str = $("<div>").attr("id", "#container-" + obj.CommentId)
$(str).append(includeReply);
$table.append('<tr><td>' + 'CommentDiv:' + str.html() + '</td></tr>');
Ajax comments insert LI or replace UL?
Question by Aen Tan
I’m ajaxifying my comments feature and I’m choosing between 2 strategies. My comments list is an unordered list.
The first option is simpler but I feel like it’s not the best or right way.
If I want to use the second option how do I know which comments in the response are newer than the ones in the DOM if more than one comment was posted at the same time?
Thoughts?
Answer by JohnP
You can keep the timestamp as a variable for JS to refer.
When you load the page, your server side language will assign the timestamp of the last comment to be loaded to a javascript variable. From there on, everytime you load more comments, send the last timestamp you requested. Your server side language will check for comments that are newer than that timestamp. Make sure to update the timestamp as you send out more requests. Either by sending it as part of the response or keeping track of when you sent the request.
Answer by Starx
You should append the comment’s
ULwith latestLIs. Why? you do not have to grab all the full UL list and replace the old one. Reduce the changes that has to be made. Just grab the latestLIand append it at the last.LESS WORK MORE EFFICIENTSo far of your question, about how to know which one is the latest comment. Store timestamp as the comments are stored in the DB. While also fetching the comments for the first time, try to assign the variable holding the timestamp of the last item, then after search the database for everything that is greating the timestamp you stored, get the list and append them, then update the variable, with the latest time stamp again.