Автозаполнение пользовательского интерфейса jQuery НЕ фильтрует элементы в списке

Я использую jQuery UI Autocomplete, чтобы помочь пользователю найти правильный продукт.
Ну, у меня есть HTML-код:

<input id="product_name" name="product" />

Я вставил код JS, чтобы заполнить поле:

$(document).on("focus", "#product_name", function() {

$.get("index.php?route=order/form/getproducts", function(json) {
$(this).autocomplete({
source: json,
minLength: 1
});
});

});

Этот код JS делает запрос к серверу, где у меня есть PHP + MySQL:

function getProducts() {

$results = $order_model->getProducts(false);
$product_names = array();

if ($results) {
foreach ($results as $result) {
$product_names[] = $result["name"];
}
print_r(json_encode($product_names));
}

Итак, что мы получаем на выходе?
Когда пользователь фокусирует курсор на поле и начинает вводить любую букву, система показывает список продуктов, НО система показывает все элементы, и даже если пользователь введет любые буквы, список не изменится!
Итак, как я должен заставить JQuery UI фильтровать элементы?

UPD. JSON ответ:
[ «Item1», «item2», «item3»]