Autocomplete shows options but does not filter as typed

Asked

Viewed 24 times

0

I’m a beginner in Jquery and I’m having the following problem: I need an input where I use the autocomplete to select the municipality I want. It displays the options, but is not filtering as the user type, are always all available options (as are all Brazilian municipalities, gives more than 5500). Below are my codes:

html autocomplete.

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="libs/js/jquery-ui.css">
    
<script src="libs/js/external/jquery/jquery.js"></script>
<script src="libs/js/jquery-ui.js"></script>
<script>
$(function() {
    $('#municipio').autocomplete({
        minLenght: 4,
        source: "municipios.php"
    });
});
</script>
</head>
<body>
    <input type="text" id="municipio">
    <input type="text" id="coordenada">
</body>
</html>

The array generated by the municipios.php file is ok, as follows: ["Abaíra-BA","Abaré-BA","Abatiá-PR","Abdon Batista-SC","Abel Figueiredo-PA","Abelardo Luz-SC", ... "Zabelê-PB","Zacarias-SP","Zé Doca-MA","Zortéa-SC"]

Another problem I detected is that when typing in the input, is not watering the minLenght, already in the first character typed appear all municipalities.

Thank you for your attention.

php jquery self-cmplete

1 answer

0

If you are not using any queries in the database, you can search directly in the PHP server-side array: Example:

$input = preg_quote($valorDigitadoNoAutoComplete, '~');
$data = ["Abaíra-BA","Abaré-BA","Abatiá-PR","Abdon Batista-SC","Abel Figueiredo-PA","Abelardo Luz-SC", ... "Zabelê-PB","Zacarias-SP","Zé Doca-MA","Zortéa-SC"]

$result = preg_grep('~' . $input . '~', $data);

Another important detail is minLenght this spelled wrong, would be minLength, therefore it does not work.

  • 1

    Thanks for the tips. I already solved, really was wrong the minLength. Php was generating whitespace before the array (my mistake, I had placed an echo before and forgot to delete). Thank you!

  • If the answer was useful, put as right. :)

Browser other questions tagged php jquery self-cmplete

You are not signed in. Login or sign up in order to post.