jQuery inserting comment help
Posted
by StealthRT
on Stack Overflow
See other posts from Stack Overflow
or by StealthRT
Published on 2010-05-02T17:41:43Z
Indexed on
2010/05/02
17:47 UTC
Read the original article
Hit count: 268
jQuery
|jquery-ajax
Hey all, i am trying to learn how to insert a comment within some html code without having to refresh the page. I know jQuery is capable of inserting a comment into a div area but i am having problems finding an example like that with fading in. Here is my comment code:
<div id="CommentBox122" style="width:80%; padding:2px; margin-left:25px;">
<table width="650px" border="0" cellpadding="0" cellspacing="5" style="margin-left:20px; background-color: #F8F8F8; border-bottom:#CCC solid 1px;"><tr>
<td width="10%" rowspan="2" align="center" class="Commentimage"><img src="img/avatar/gkrgimmkdhmggfh.jpg" height="60" /></td>
<td width="90%" class="Commentposted">Posted by me on Saturday, May 01, 2010 @ 4:37: PM</td></tr>
<tr><td class="Commentsaying">this is a test comment</td></tr>
</table>
<div id="stylized" class="myform" align="center">
<form id="CommentForm122" name="CommentForm122">
<div align="center" style="text-align:center; color:#F00; font-family:Arial, Helvetica, sans-serif; font-weight:bold;">Would you like to leave a comment, Robert?</div>
<textarea name="txtComment" class="box" id="txtComment"></textarea>
<input name="txtpostid" type="text" id="txtpostid" style="visibility:hidden; display:none; height:0px; width:0px;" value="Demo43639" />
<div class="buttons" align="center">
<button type="button" id="Button122" name="Button122" class="positive" onclick="doStuff();"><img name="Submit" src="img\buttonimgComment.png" alt="" />Post Comment</button>
</div>
</form>
</div>
</div>
The code i need to insert again would be:
<table width="650px" border="0" cellpadding="0" cellspacing="5" style="margin-left:20px; background-color: #F8F8F8; border-bottom:#CCC solid 1px;"><tr>
<td width="10%" rowspan="2" align="center" class="Commentimage"><img src="img/avatar/gkrgimmkdhmggfh.jpg" height="60" /></td>
<td width="90%" class="Commentposted">Posted by me on Saturday, May 01, 2010 @ 4:37: PM</td></tr>
<tr><td class="Commentsaying">this is a test comment</td></tr>
</table>
But again, i am unable to find an example using jQuery to automatically insert that part of the code under the other "table> /table>" box..
So after its inserted by jQuery, the code should look like this:
<div id="CommentBox122" style="width:80%; padding:2px; margin-left:25px;">
<table width="650px" border="0" cellpadding="0" cellspacing="5" style="margin-left:20px; background-color: #F8F8F8; border-bottom:#CCC solid 1px;"><tr>
<td width="10%" rowspan="2" align="center" class="Commentimage"><img src="img/avatar/gkrgimmkdhmggfh.jpg" height="60" /></td>
<td width="90%" class="Commentposted">Posted by me on Saturday, May 01, 2010 @ 4:37: PM</td></tr>
<tr><td class="Commentsaying">this is a test comment</td></tr>
</table>
<table width="650px" border="0" cellpadding="0" cellspacing="5" style="margin-left:20px; background-color: #F8F8F8; border-bottom:#CCC solid 1px;"><tr>
<td width="10%" rowspan="2" align="center" class="Commentimage"><img src="img/avatar/gkrgimmkdhmggfh.jpg" height="60" /></td>
<td width="90%" class="Commentposted">Posted by me on Saturday, May 01, 2010 @ 4:37: PM</td></tr>
<tr><td class="Commentsaying">this is a test comment</td></tr>
</table>
<div id="stylized" class="myform" align="center">
<form id="CommentForm122" name="CommentForm122">
<div align="center" style="text-align:center; color:#F00; font-family:Arial, Helvetica, sans-serif; font-weight:bold;">Would you like to leave a comment, Robert?</div>
<textarea name="txtComment" class="box" id="txtComment"></textarea>
<input name="txtpostid" type="text" id="txtpostid" style="visibility:hidden; display:none; height:0px; width:0px;" value="Demo43639" />
<div class="buttons" align="center">
<button type="button" id="Button122" name="Button122" class="positive" onclick="doStuff();"><img name="Submit" src="img\buttonimgComment.png" alt="" />Post Comment</button>
</div>
</form>
</div>
</div>
As always, any help would be great! :o)
David
© Stack Overflow or respective owner