I am trying to get a type ahead/auto complete search bar working. I've pieced the below code together from a few different sources. Nothing prints out when I just run the php script by itself, could that be the issue? I'm not 100% sure where my error is. Nothing displays when I start typing in the search box and in developer tools I see an error: JSON.parse unexpected end of data at line 5 column 1 of the JSON data.
HTML/JS
<script src="../../jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.1/bootstrap3-typeahead.min.js"></script>
<html>
<body>
<div id="the-basics">
<input class="typeahead" type="text" placeholder="Customer Name">
</div>
</body>
</html>
<script>
$( document ).ready(function() {
$('input.typeahead').typeahead({
source: function (query, process) {
return $.get('test.php', { query: query }, function (data) {
data = $.parseJSON(data);
return process(data);
});
},
showHintOnFocus:'all'
});
});
PHP test.php
<?php
$conn = new PDO ('odbc:xxxxxxxx','x','xxxxxx');
$qry = "select distinct name_customer from v_customer_master";
$sql = $conn->query($qry);
$data = $sql->fetchall((PDO::FETCH_ASSOC));
//also tried foreach($data as $row){$json[]=$row['name_customer'];}
echo json_encode($data);
?>