CODEWITHSUNDEEP
ajaxhtmlreload
MomasVII
MomasVII

Reputation: 5071

refresh div (comments Like Facebook)

I am trying to make a comments section like facebook where you press enter and it adds the comment without refreshing the page.

So the idea I have and let me know if there's an easier way but I am trying to get the form submitted with enter then have ajax send the form data to comment.php the have that comment div refresh. I'm running into problems. Mainly how to refresh a div inside an enter pressed function. Here is what I have got....

$('#commentForm').keyup(function(e) {
if (e.keyCode == 13) {
    e.preventDefault()
    var songComment = $("#songComment").val();
    var username = $("#username").val();
    var comid = $("#comid").val();
    var dataString = 'songComment=' + songComment + '&username=' + username + '&comid=' + comid;
    if(dataString=='' || songComment=='' || username=='' || comid=='')
    {

    }
    else
    {
        $.ajax
        ({
            type: "POST",
            url: "comment.php",
            data: dataString,
        });
        $("#videoFooter").load('videosFooter.php');
    }
    return false;
};
});

So the problem that i appear to have is the reload div doesn't work. i.e. I don't really know how to do that properly.

edit: A few things to note. This whole comment area is going down in a php page called commentArea.php So essentially i need commentArea.php refreshed and that would refresh the area I want. So this page has a comments form submitted with enter the a few divs that include username and comment and date. then ends.

Thanks

Upvotes: 1

Views: 386

Answers (1)

skparwal
skparwal

Reputation: 1084

You can try this one: (modify according to your need). This is to click on submit button.

<script type='text/javascript'>
    /* attach a submit handler to the form */
    $("#commentForm").submit(function(event) {

      /* stop form from submitting normally */
      event.preventDefault();

      /* get some values from elements on the page: */
      var $form = $( this ),
          url = $form.attr( 'action' ); //or "comment.php" 

      /* Send the data using post */
      var posting = $.post( url, { songComment: $('#songComment').val(), username: $('#username').val(), comid: $('#comid').val() } );

      /* Put the results in a div */
      posting.done(function( data ) {
        alert('success');
      });
    });
</script>

you can also try:

$("#commentForm").on('submit', (function(event) {

Upvotes: 1

Related Questions