send mail (mail to php Post method) using Ajax and jQuery
<p>i'm sending mail from my html page by executing a Php function,  my index.html :</p>

<pre><code>  &lt;form method="POST" action="sendmail.php" &gt;
 &lt;input type="text" name="sender_name" placeholder="Name" required=""&gt;
 &lt;input type="text" name="sender_email" placeholder="Email" required=""&gt;
 &lt;input type="text" name="subject" placeholder="Subject" required=""&gt;
 &lt;textarea placeholder="Message" name="message" required=""&gt;&lt;/textarea&gt;
  &lt;input type="submit" name="send" value="SEND"&gt;

    &lt;/form&gt;
</code></pre>

<p>my sendmail.php:</p>

<pre><code>&lt;?php
if($_POST['send'] == 'SEND'){

$to      = 'queries@mydomain.com';
$subject = $_POST['subject']; 
$message = $_POST['message']; 
$headers = "From: ".$_POST['sender_nam‌​e​']." &lt;".$_POST['sender_em‌​ail‌​']."&gt;\r\n"; $headers = "Reply-To: ".$_POST['sender_ema‌​il‌​']."\r\n"; 
$headers = "Content-type: text/html; charset=iso-8859-1\r\n";
'X-Mailer: PHP/' . phpversion();
mail($to, $subject, $message, $headers);
}
?&gt;
</code></pre>

<p>the above is working fine  but its also leaving current page i wanna execute the above method on current page and for that according to this <a href="https://stackoverflow.com/questions/40792298/perform-post-method-on-current-page">question</a> &amp; this <a href="https://stackoverflow.com/questions/2866063/submit-form-without-page-reloading">question</a></p>

<p>i have to use <strong>Ajax</strong> and <strong>jQuery</strong>? and i know nothing about them so far i have this :</p>

<pre><code>////in my index.html
&lt;button type="button"&gt;send mail&lt;/button&gt;
&lt;p&gt;&lt;/p&gt;
&lt;script type="text/javascript"&gt;



    $(document).ready(function(){
        $("button").click(function(){

            $.ajax({
                type: 'POST',
                url: 'sendmail.php',
                success: function(data) {
                    alert(data)
                    $("l").text(data);

                }
            });
   });
});
&lt;/script&gt;
</code></pre>

<p>i know above is not correct &amp; its not working (currently its showing sendmail.php's text in a popup) how can i make it work so that i can execute sendmail.php ???</p>

<p>UPDATE:</p>

<p><strong>index.html</strong></p>

<pre><code>    &lt;form method="POST" id="myForm" action="sendmail.php"&gt;
  &lt;input type="text" name="sender_name" placeholder="Name" required=""&gt;
  &lt;input type="text" name="sender_email" placeholder="Email" required=""&gt;
  &lt;input type="text" name="subject" placeholder="Subject" required=""&gt;
  &lt;textarea placeholder="Message" name="message" required=""&gt;&lt;/textarea&gt;
  &lt;input type="submit" name="send" value="SEND"&gt;
&lt;/form&gt;



&lt;/div&gt;
&lt;script type="text/javascript"&gt;


  $(document).ready(function(){
        $("#myForm").on('submit', function(){
            var formData = $(this).serialize();
            $.ajax({
                type: 'POST',
                url: 'sendmail.php',
                data: formData,
                success: function(response.success) {
                    alert(response.success)
                    $("l").text(response.success);

                }
            });
   });
&lt;/script&gt;
    `
</code></pre>