I'm trying to build an autocomplete dropdown input text box using jQuery Autocomplete. I've had it working previously but now I'm building the program with OOP PHP instead of procedural PHP to keep it a bit cleaner.
I'm able to send the AJAX request and it posts to the correct file, but I'm not getting any response in return, I'm not exactly sure why. Take a look:
This is the input:
<div class="form-floating shadow" id="inputBox">
<input type="text" class="form-control mb-4 autocomplete" id="existingCustomerSearch" name="existingCustomerSearch" placeholder="Search existing buyers (name, phone number)">
<label for="existingCustomerSearch">Search existing customers... (name, phone number)</label>
</div>
The jquery autocomplete request:
$('#existingCustomerSearch').autocomplete({
source: function(request, response) {
$.ajax({
url: '../models/Pages.php',
type: 'POST',
dataType: 'JSON',
data: {
userInput: request.term
},
success: function(data) {
console.log(data);
response ($.map(data, function(item) {
return {
label: item.customer_id,
value: item.first_name
}
}))
}
});
}
});
The model
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$_POST = filter_input_array(INPUT_POST, FILTER_SANITIZE_STRING);
if (isset($_POST['userInput'])) {
$searchInput = $_POST['userInput'];
$searchData = $this->customerModel->searchCustomer($searchInput);
$searchData = json_encode($searchData);
echo $searchData
}
}
The controller
public function searchCustomer($data) {
$this->db->query('SELECT * FROM customer WHERE last_name LIKE :last_name');
$this->db->bind(':last_name', $data . '%');
$results = $this->db->resultSet();
return $results;
}
The way this should function is the user inputs some text, AJAX posts it to the model which passes the input as a parameter of the searchCustomer method and returns the data in a json format as the 'source' in the jquery autocomplete.
I think what's happening is the data is not returning correctly, I can't figure out how to get it back to the view through the ajax call. Please if anyone has any idea why this doesn't work I'd be very appreciative.
Here is the Database to answer the $this->db and query/bind questions.:
<?php
class Database {
private $dbHost = DB_HOST;
private $dbUser = DB_USER;
private $dbPass = DB_PASS;
private $dbName = DB_NAME;
private $statement;
private $dbHandler;
private $error;
public function __construct() {
$conn = 'mysql:host=' . $this->dbHost . ';dbname=' . $this->dbName;
$options = array(
PDO::ATTR_PERSISTENT => true,
PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION
);
try {
$this->dbHandler = new PDO($conn, $this->dbUser, $this->dbPass, $options);
} catch (PDOException $e) {
$this->error = $e->getMessage();
echo $this->error;
}
}
//Allows us to write queries
public function query($sql) {
$this->statement = $this->dbHandler->prepare($sql);
}
//Bind values
public function bind($parameter, $value, $type = null) {
switch (is_null($type)) {
case is_int($value):
$type = PDO::PARAM_INT;
break;
case is_bool($value):
$type = PDO::PARAM_BOOL;
break;
case is_null($value):
$type = PDO::PARAM_NULL;
break;
default:
$type = PDO::PARAM_STR;
}
$this->statement->bindValue($parameter, $value, $type);
}
//Execute the prepared statement
public function execute() {
return $this->statement->execute();
}
//Return an array
public function resultSet() {
$this->execute();
return $this->statement->fetchAll(PDO::FETCH_ASSOC);
}
//Return a specific row as an object
public function single() {
$this->execute();
return $this->statement->fetch(PDO::FETCH_ASSOC);
}
//Get's the row count
public function rowCount() {
return $this->statement->rowCount();
}
}
Here is the full customer model for more clarity.. db is a private method of the customer object that deals with all database interactions... database.php (above) is where all those actions live
<?php
class Customer {
private $db;
public function __construct() {
$this->db = new Database;
}
public function createCustomer($data) {
$this->db->query('INSERT INTO customer (first_name, last_name, phone_number, phone_number_2, email, email_2, referral_type_id) VALUES (:first_name, :last_name, :phone_number, :phone_number_2, :email, :email_2, :referral_type_id)');
//Bind values
$this->db->bind(':first_name', $data['first_name']);
$this->db->bind(':last_name', $data['last_name']);
$this->db->bind(':phone_number', $data['phone_number']);
$this->db->bind(':phone_number_2', $data['phone_number_2']);
$this->db->bind(':email', $data['email']);
$this->db->bind(':email_2', $data['email_2']);
$this->db->bind(':referral_type_id', $data['referral_type_id']);
//Execute the function
if ($this->db->execute()) {
return true;
} else {
return false;
}
}
public function getCustomers() {
$this->db->query('SELECT * FROM customer');
$results = $this->db->resultSet();
return $results;
}
public function searchCustomer($data) {
$this->db->query('SELECT * FROM customer WHERE last_name LIKE :last_name');
$this->db->bind(':last_name', $data . '%');
$results = $this->db->resultSet();
$results = json_encode($results);
echo $results;
}
public function getReferralType() {
$this->db->query('SELECT * FROM referral ORDER BY referral_type ASC');
$results = $this->db->resultSet();
return $results;
}
}