CODEWITHSUNDEEP
javascriptphpjqueryajaxjquery-mobile
ron tornambe
ron tornambe

Reputation: 10780

Why does a simple ajax call to php exhibit such strange behavior?

I am making a call to a jQuery Mobile form to a simple PHP mailing file. I have tested the PHP file using the same data I am passing from the ajax call, which works just fine. However, when using ajax, the email is not sent and the address bar contains the query string. I really need more sets of eyes looking a this, since my mine seem permanently crossed.

Form Excerpt

        <form id="hipaa-form" name="hipaa-form" autocomplete="on" data-ajax="false">
            <p data-role="fieldcontain">
                <label for="name">Name:<span class="smallred">*</span></label>
                <input type="text" name="name" id="name" autofocus required placeholder="Full Name">
            </p>
            <p>
                <input type="submit" name="send" id="send" style="cursor:pointer" value="Submit">
            </p>
        </form>

JavaScript

$('#hipaa-form').on('submit', function (e) {
    var data = $(this).serialize();
    $.ajax({
        type: "GET",
        url: email.php,
        data: data,
        dataType: "text",
        success: function (result) { alert(result); },
        error: function(xhr, status, error) {
                  var err = eval("(" + xhr.responseText + ")");
                  alert("Error: " + +err.Message)
               }
    });
});

Note the data variable is set correctly, and is the string that winds up in the address bar. The alert from the success function displays the entire web page, but again the email is not sent. I tried setting custom error handlers in PHP, but they were no help at all.

PHP 

    $body = "Full Name: " . $_GET["name"] . "\r\n";
    $body = $body . "email: " . $_GET["email"] . "\r\n";
    $body = $body . "Phone: " . $_GET["phone"] . "\r\n";
    $body = $body . "website: " . $_GET["Website-URL"] . "\r\n";
    $body = $body . "app. type: " . $_GET["pgm-type"] . "\r\n";
    $body = $body . "uses DB: " . $_GET["uses-db"] . "\r\n";
    $body = $body . "saves data: " . $_GET["stores-patient-data"] . "\r\n";
    $body = $body . "db vendor: " . $_GET["database-vendor"] . "\r\n";
    if (isset($_GET["db-other"]))
        $body = $body . "other db: " . $_GET["db-other"] . "\r\n";

    $to = "[email protected]";
    $subject = "HIPAA Form Submission";

    mail($to, $subject, $body, "From: [email protected]");
    echo "Form Submitted"

?>

My test site is : http://test.bunkerhill.com/

TIA

Upvotes: 1

Views: 61

Answers (2)

Arkantos
Arkantos

Reputation: 6608

url param in your Ajax definition should be 'email.php' in quotes, so change 

url: email.php

to 

url: 'email.php'

Without that it's just sending a call to http://test.bunkerhill.com/ and your PHP code sending email is never invoked at all :)

Upvotes: 0

Matt
Matt

Reputation: 5428

You need to block the form from being submitted with preventDefault();

$('#hipaa-form').on('submit', function (e) {
    e.preventDefault();
...
}

Your ajax request should use querystring parameters with a GET or, change to type: "POST" and adjust your PHP to use $_POST

Example:

type: "GET",
url: "page.php?foo=x&bar=y"

Or

type: "POST",
url: "page.php",
data: data

Lastly, I'm a little worried about this example including HIPAA information. You might want to consider an approach where you store the information in a secure location and simply send an email that says, "Hey a new message is available. Click here to authenticate against our secure system to read it." Not that there is anything absolutely wrong with your approach but it feels like there is additional HIPAA related liabilities to consider.

Upvotes: 4

Related Questions