javascript - Ajax doesn't do anything when php connected to database

Question

I'm trying to establish a simple connection between Javascript and my database using ajax and PHP. Javascript is supposed to receive a name from an HTML form, modify it and post it to PHP to check whether the name is already in the database and return true/ false back to javascript for further use.

Everything works fine as long as I don't add the part of code that connects to the database. Calling only the PHP file in Chrome also works and it will correctly print true or false. As soon as I connect both together, nothing works. Neither success nor error will execute any of the code inside their functions.

---

JS1 + PHP1: Nothing happens

JS1 + PHP2: Correctly shows result in Alert1 and Alert2

PHP1 alone: Correctly prints either true or false

---

JS1

var boo = false;
if(str.length > 1) boo = true;
if (boo)
         $.ajax ({
                url: 's5Check.php',
                type: 'post',
                data: { str : str },
                success: function( result ) {
                    alert(result);                           //Alert1
                    if(result != false){
                        boo = false;
                        alert(str + " already exists!");     //Alert2
                    } else {
                        boo = true;
                        alert(str + " doesn't exist!");      //Alert3
                    }
                },
                error: function( e ) {
                    alert("Error: " + e);                    //Alert4
                }
            });

PHP1

<?php
    if (isset($_POST['str'])) {
        $con = mysqli_connect("localhost","root","","dbtest");
        $temp = mysqli_real_escape_string($con, $_POST['str']);
        $check = "SELECT id FROM handle WHERE name = '$temp'";
        $result = $con -> query($check);
        if($result->num_rows > 0) {
            echo true;
        } else{
            echo false;
        }
    } else{
        echo "error";
    }   
?>

PHP2

<?php
    echo $_POST['str'];
?>

Thanks.

Answer 1

echo true will output 1. echo false will output nothing. You're not checking for either of these in your success function.

Using JSON is a simple solution to this, and allows for easy enhancement to more complex results.

JS:

$.ajax({
  url: 's5Check.php',
  type: 'post',
  data: {
    str: str
  },
  dataType: 'json',
  success: function(result) {
    alert(result); //Alert1
    if (result === false) {
      boo = false;
      alert(str + " already exists!"); //Alert2
    } else if (result === true) {
      boo = true;
      alert(str + " doesn't exist!"); //Alert3
    } else if (result === "error") {
      alert("Error");
    } else {
      alert("Unknown problem");
    }
  },
  error: function(jqXHR, txtStatus, e) {
    alert("Error: " + e); //Alert4
  }
});

PHP:

<?php
    if (isset($_POST['str'])) {
        $con = mysqli_connect("localhost","root","","dbtest");
        $check = "SELECT id FROM handle WHERE name = ?";
        $stmt = $con->prepare($check);
        $stmt->bind_param("s", $_POST['str']);
        $result = $stmt->execute();
        $response = $result->num_rows > 0;
    } else{
        $response = "error";
    }
    echo json_encode($response);
?>