How to slide down in javascript if the data posted

Question

I build a code here.. that when he\she posts a comment the JavaScript will slide down a new comment block...

But i need to refresh after click the post button - then - there will be a new comment block under a post.

This is my code:

<script language="javascript" type="text/javascript">
//Sending the jquery comment
function SendComment(blab_id) {
    var comment_txt = $("#Comment"+blab_id).val()

    if(comment_txt == ""){
    alert("Please Enter a Comment!");
    }else{

    $.post("scripts/send_comment.php", {Comment: comment_txt, bid: blab_id} ,function(data){

    $("#new_comment"+blab_id).html(data);
    $("#new_comment"+blab_id).slideDown(300);
    $("#Comment"+blab_id).val("");

    });

    }
}
</script>

Does $("#new_comment"+blab_id).html(data); exist on the page? I don't think you can just randomly add containers like that... — cosmorogers, Jan 28 '12 at 03:24
@cosmorogers sorry i didn't put the container in this div... could you please correct this code
'.$comment_user.'
'.$comment_txt.'
·'.$whenComment.'· — Syareez Zainal, Jan 28 '12 at 13:22

score 0 · Answer 1 · answered Jan 28 '12 at 09:44

0

assuming your script works fine, except that u need to refresh page every time...

why cant you automatically refresh that particular div without loading overall page like this...

$('#Comment"+blab_id).load('yourpage.php');

answered Jan 28 '12 at 09:44

sree

498
4
19

score 0 · Answer 2 · edited May 23 '17 at 12:27

What is "#Comment"+blab_id ? If that is just an input field, what is blab_id?

I think what you want is something like http://jqueryui.com/demos/dialog/#modal-form , but instead of a table a bunch of divs. I would have one div id=comments that contains all the comments, then you should be able to add more comments to the bottom of this. So instead of

$("#new_comment"+blab_id).html(data);
$("#new_comment"+blab_id).slideDown(300);

you would have $("comments").append(data).fadeIn(); (According to this) (Or prepend if you want the comment to appear at the top) (I haven't checked if this works though...)

where I assume data is

<div style="background-color:#f0f9fe";border-bottom:1px dashed #3A69B6; padding:5px; width:auto;">
    <strong>'.$comment_user.' </strong>
    <br/>'.$comment_txt.' <br/> ·'.$whenComment.'·
</div>

which is returned from scripts/send_comment.php

How to slide down in javascript if the data posted

2 Answers2