0

I am trying to create a script that will send a email to our company email when someone clicks a button. The html will be hosted on a static page and will do everything client side, whereas the php code will be hosted on another domain.

What I have tried so far is.

HTML

<head><title>Report Errors</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script></head>
<script>$(".c").click(function(){
var href = this.href;
        $.ajax({
        url: 'http://example.com/m35.php',
        type: 'POST',
        data: { subject: href },
        success: function (data) {
                    setTimeout(function (){
                    $(".container").html(data)
                    }, 1000)
                }
        });
    })
</script>

<a href="http://link-to-be-sent.example.com" class="c">send</a>
<div class="container">success</div>

And the code in m35.php file -

<?php  

$mailTo = "mail@example.com"; 
$mailFrom = "no-reply@example.com";  
$subject = $_POST["subject"];
$message = "someone reported the content in subject doubtful.";  


mail($mailTo, $subject, $message, "From: ".$mailFrom);  
?>

EDIT : Based upon comments I want to clarify that it is even not working on same domain and directory, However this type of code is also working but how to do that without page reload with javascript/jquery.

<form method="post" action="http://example.com/m35.php">
<input type="text" name="subject" id="subject" value=""> <input type="submit">
</form>
Avadhesh18
  • 27
  • 1
  • 9
  • 1
    It's a CORS issue, where you can't send data to a different domain using AJAX. – Scimonster Sep 21 '14 at 13:02
  • 1
    Maybe this could help? https://stackoverflow.com/questions/17318426/cors-cross-domain-ajax-without-jsonp-by-allowing-origin-on-server – parchment Sep 21 '14 at 13:03
  • Thanks for suggestion @Scimonster but this is even not working on same domain – Avadhesh18 Sep 21 '14 at 13:06
  • Why you say it is not working? Is php code executed? Are there any errors on client or on server side? – py3r3str Sep 21 '14 at 13:17
  • The only thing this script do will send an email to address specified in mailto, This script works when I load the page directly by entering example.com/m35.php in address bar and changing $subject. – Avadhesh18 Sep 21 '14 at 13:19

1 Answers1

2

Click event is attached before dom element is render. So it isn't fired. $(".c") is a html element so after click, it will load another page. In that case ajax request may not reach the server. To prevent this js code should be in $( document ).ready() event and use return false; from click event to block page load:

<script>
$( document ).ready(function(){
    $(".c").click(function(){
        var href = this.href;
        $.ajax({
            url: 'http://example.com/m35.php',
            type: 'POST',
            data: { subject: href },
            success: function (data) {
                setTimeout(function (){
                    $(".container").html(data)
                }, 1000);
            }
        });
        return false; // prevent load to another page
    });
});
</script>
py3r3str
  • 1,879
  • 18
  • 23
  • Thanks fixed that but it is still not sending the email. see the updated question where it works when submiting through a form. – Avadhesh18 Sep 21 '14 at 13:38
  • If you click `a` html element it loads another page and js code may be not executed. See edits I've made. – py3r3str Sep 21 '14 at 13:42
  • Upvoted for that. Thanks it all worked. Do you know how to run both html and php on different domains. – Avadhesh18 Sep 21 '14 at 15:41
  • 1
    Check [this question](http://stackoverflow.com/questions/13388942/allow-cross-domain-ajax-requests) to see how to enable CORS in php. You can accept my answer if you feel happy with it;) – py3r3str Sep 21 '14 at 15:48