php - Only first login via $.ajax always fails and causes a page reload

Question

I asked this before, but each time, other 'bugs' were thought to be the root cause. Unfortunately, they weren't.

When a User tries to login the first time, the PHP server returns to the jQuery $.ajax error block. It also forces a page reload, making it difficult to debug in Webkit.

Every successive login works perfectly, until the browser is closed (cookies expire). Then the first login fails again.

Here is the Javascript that is executed when a user logs in.

var form_data = {
    email:        email,
    password:     password
};

$.ajax({
    type:        'POST',
    url:         '/Login.php',
    data:         form_data,
    success:      function(jsonResponse){
        console.log('Login returned via success.'); // Always hits this AFTER first login.          

        console.dir(jsonResponse);
    },
    error: function (xhr, textStatus, error) {
        console.log('Login returned via error.');   // Hits this on first login.            

        console.log(xhr);
        console.log(textStatus);
        console.log(error);
     }
});

Note that in the PHP, ALL DB calls have the following syntax, and none return an error.

error_reporting(E_ALL);
$opt = array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION);
$dsn = 'mysql:host=localhost;dbname=' . $DB_Database;
$dbh = new PDO($dsn, $DB_UserName, $DB_Password, $opt);
$sth = $dbh->prepare("SELECT * FROM Users WHERE EMail=:email OR Temp_EMail=:temp_email");
$sth->bindParam(':email',      $email, PDO::PARAM_STR);
$sth->bindParam(':temp_email', $email, PDO::PARAM_STR);
$sth->execute();

Here is the PHP code segment preparing and returning the JSON.

$messageList = array();

$message = array('status' => 0,  'heading' => "SUCCESS:", 'message' => "You are now logged in.");
array_push($messageList, $message);

$response = array('success' => true, 'messageList' => $messageList, 'userName' => $fullName);
$json     = json_encode($response);

dump_to_error_log($json);  

echo $json;

return;

Here is the JSON from the error log on first login:

{"success":true,"messageList":[{"status":0,"heading":"SUCCESS:","message":"You are now logged in."}],"userName":"My Name"}

Here is the JSON from the error log after first login:

{"success":true,"messageList":[{"status":0,"heading":"SUCCESS:","message":"You are now logged in."}],"userName":"My Name"}

Yep. The JSON is identical each time. So, why is the page reloaded the first time?

Here is what I see in the console on the first login attempt.

Login returned via error. script.js:3001

Object {readyState: 0, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}
 script.js:3002

error script.js:3003
 script.js:3004

Here is what I see in the console on the first login attempt. (Domain redacted.)

XHR finished loading: "http://dev.DOMAIN.com/Login.php". jquery.min.js:3
    send jquery.min.js:3
    st.extend.ajax jquery.min.js:3
    loginButtonClicked script.js:2963
    onclick dev.DOMAIN.com:910
Login returned via success. script.js:2968
{"success":true,"messageList":[{"status":0,"heading":"SUCCESS:","message":"You are now logged in."}],"userName":"My Name"}
No Properties

Any idea why the behavior fails for the first login attempt?

Thanks!