user3142695
user3142695

Reputation: 17332

Getting filtered results by JQuery UI autocomplete

I don't know what I'm doing wrong. I tried to use autocomplete with json, but I always get the complete data. I expect filtered data from the user input.

JS:

$( "#tags" ).autocomplete({
    source: "/script.php",
    minLength: 2,
    select: function(event, ui) {
        var url = ui.item.id;
        if(url != '#') {
            location.href = '/blog/' + url;
        }
    },
    open: function(event, ui) {
        $(".ui-autocomplete").css("z-index", 1000);
    }
});

PHP:

$result = $paed_db->prepare('SELECT data FROM table');
$result->execute();
$a_json = array();
while($data = $result->fetch(PDO::FETCH_OBJ)) {
    $a_json_row["value"] = $data->data;
    array_push($a_json, $a_json_row);
}

$json = json_encode($a_json);
print $json;
exit;

Upvotes: 0

Views: 111

Answers (2)

HeatherEMSL
HeatherEMSL

Reputation: 285

JQueryUI does nothing to filter the results - you need to do the search in your query on the PHP script. JQueryUI sends the user input via a GET request, so you can access it using:

$search = $_GET['term'];

(See http://api.jqueryui.com/autocomplete/#option-source)

So you can then use that $search variable in your prepared query to select the appropriate rows from the table. For example, if you had a column called name that you wanted to search on:

$result = $paed_db->prepare('SELECT data FROM table WHERE name LIKE :search');
$result->execute(array('search' => '%'.$search.'%'));

Upvotes: 1

Raymond Camden
Raymond Camden

Reputation: 10857

It is because you are always returning everything. Look at your query. You don't filter the query by the user input from the autocomplete. The user's input is passed automatically as a URL param called term. Your query should use that to filter the data. See more here: http://api.jqueryui.com/autocomplete/#option-source

Upvotes: 1

Related Questions