Question

Hello you naughty code animals..

I have tried to get this code to work, and also searching it up. But i find no up-to-date answer i can understand.
So i’ll give you the form, then the jQuery.

FORM:

<div id="blab_form_overcontent">
    <table border="0" align="center">
        <form id="submit_blab" method="post">
        <input type="text" name="blab_title" id="blab_title" value="" placeholder="title(optional):"/><br/>
        <textarea name="blab_text" id="blab_text" value="" placeholder="text:"></textarea>
        <input type="submit" id="blab_submitb" name="blab_submitb" value="Post"/>
        </form>
        <div class="success" style="display: none;">Blab has been added.</div>
    </table>
</div>

jQuery:

$(document).ready(function(){
  $("form#submit_blab").submit(function() {
  // I store the values from the form input box, then send via ajax below
  var blab_title   = $('#blab_title').attr('value');
  var blab_text    = $('#blab_text').attr('value');
    $.ajax({
        type: "POST",
        url: "classes/profileActions.php",
        data: "blab_title="+ blab_title +"& blab_text="+ blab_text,
        success: function(){
            $('form#submit_blab').hide(function(){$('div.success').fadeIn();});

        }
    });
    return false;
  });
});

NOTE: i know its not my profileActions.php that is the problem because the code over dont get as far as posting anything. It reloads the page only.

Regards,
-Clueless idiot.

Answer 1

It’s refreshing the page because you aren’t telling it to NOT refresh the page. 🙂

$('#submit_blab').submit(function(e){
  //start with preventing the default submit action...
  e.preventDefault();

  var blab_t   = $('#blab_title').val();
  var blab_txt    = $('#blab_text').val();

  var json = { blab_title: blab_t, blab_text: blab_txt }      

  $.ajax({
    type: "POST",
    url: "classes/profileActions.php",
    data: json,
    success: function(){
        $('form#submit_blab').hide(function(){$('div.success').fadeIn();});
    }
  });
});