title: Submit a HTML form without redirection and showing a success message
body: <p>I decided to switch from a WordPress website to a self-made with HTML, CSS and JS, aiming to improve performance. So far, relying on tutorials, I've managed to deal with almost every issue, but I just can't get the contact form work the way it worked in WP. So far it redirects me to another page that shows the success message, which is just ugly.</p>
  
  <p>Basically, I want the submit button to do 3 things: 1. Not to redirect me to another page. 2. Reset the form. 3. Display a success message. </p>
  
  <p>Read many similar questions here, but as I am completely unfamiliar with AJAX, finally decided to post this question. Here's my code:</p>
  
  <p>Index.html:</p>
  
  <pre><code>     &lt;div&gt;
          &lt;form method="post" action="form.php" name="myForm"&gt;
            &lt;input name="name" placeholder="Nombre" required&gt;
            &lt;input name="email" type="email" placeholder="Correo Electrónico" required&gt;
            &lt;textarea rows="10" name="message" placeholder="Mensaje" required&gt;&lt;/textarea&gt;
            &lt;input id="submit" name="submit" type="submit" value="Enviar Mensaje" class="boton-rojo"&gt;
          &lt;/form&gt;
        &lt;/div&gt;
  </code></pre>
  
  <p>and in form.php:</p>
  
  <pre><code>&lt;?php
  
  $name = $_POST['name'];
  $email = $_POST['email'];
  $message = $_POST['message'];
  $formcontent="De: $name \n Mensaje: $message";
  $recipient = "contacto@mydomainname.cl";
  $subject = "Mensaje desde el sitio web";
  $mailheader = "From: $email \r\n";
  mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
  echo "Tu consulta fue recibida";
  
  ?&gt;
  </code></pre>
  
  <p>Any help would be much appreciated.</p>
  
  <p>Thanks.</p>