title: JavaScript: Stopping form from refreshing?
body: <p>I am trying to get my form to stop refreshing on submit and instead I would like to make an ajax call, I haven't done the ajax part yet but its still refreshing?</p>
  
  <p>What have you tried?
  I have took suggestions on the forum and added 'return false;' after the function is called onSubmit?</p>
  
  <pre><code>$('#message_form').submit(function() {
      postMessage();
      return false;
  });
  
  function postMessage() {
      var isValid = true;
  
      var username = document.forms["post_message_form"]["username"].value;
      var message = document.forms["post_message_form"]["message"].value;
  
      var errorMessage = "Something went wrong, try again!";
  
      if (isEmpty(username) || isEmpty(message)) {
          errorMessage = "You can't post with an empty name or message.";
          isValid = false;
      }
  
      if (!isValid) {
          alert(errorMessage);
      }
      else {
          alert("Your message has been posted.");
      }
  
      return false;
  }
  
  function isEmpty(field) {
      return field == null || field == "";
  }
  </code></pre>
  
  <p>Form:</p>
  
  <pre><code>&lt;form id="message_form" name="post_message_form" method="post"&gt;
              &lt;input type="text" class="form-control" placeholder="Whats your name?" name="username"&gt;
              &lt;textarea class="form-control" placeholder="Whats your message?" name="message"&gt;&lt;/textarea&gt;
              &lt;input type="submit" class="btn btn-info" name="message_form" value="Submit Message"&gt;
          &lt;/form&gt;
  </code></pre>