I cannot get the results of a jQuery UI autocomplete to show, although the php code returns json results. The jquery code is as follows:
$("#newName").autocomplete({
source: function(request, response) {
$.ajax({
url: root + "/assets/php/autocomplete.php",
dataType: "json",
data: {
term : request.term,
field : "name"
},
success: function(data) {
response(data);
}
});
});
The php code is:
while ($row = $result->fetch(PDO::FETCH_ASSOC)) {
$row_array['value'] = $row[$field];
array_push($return_arr,$row_array);
}
echo json_encode($return_arr);
When checking the results in Firebug, I get a response such as:
[{"value":"jdoe"}]
However, I never see a list of suggestions showing in the html page.
I fixed the problem by adding to my master css file a z-index style for the autocomplete. Everything now works properly.
.ui-autocomplete {
z-index: 100;
}