Материализация автозаполнения с использованием php, mysql и jQuery - PullRequest
Новая
       21

Материализация автозаполнения с использованием php, mysql и jQuery

0 голосов
/ 02 октября 2018

Я использую автозаполнение материализации, чтобы получить список предложений из моей таблицы базы данных.Я даю исходный код в виде файла php, в котором я повторяю файл json.Ниже приведен код.Это не работает.почему?

index.php 

<div class="input-field ">
<input type="text" name="t" id="t" class="autocomplete">
</div>
<script>
$(function () {
$('input.autocomplete').autocomplete({
source: 'suggest.php?key=%QUERY'

});
});    
</script>

offer.php 

<?php
$key=$_GET['key'];
$array = array();
$conn = mysqli_connect('localhost', 'root', '', 'home_services');

$query= "select * from worker where lname LIKE '%{$key}%'"; 
$res = mysqli_query($conn, $query);

if($res->num_rows>0){
while($row=$res->fetch_assoc()){
$lname[]= trim($row["lname"]);

}
}
echo json_encode($lname);
?>

1 Ответ

0 голосов
/ 02 октября 2018

У автозаполнения Materialize нет опции source, которая автоматически загружает предоставленный URL-адрес.

Когда вы посмотрите на документацию , вы увидите, что вам нужно инициализироватьВаше автозаполнение выглядит следующим образом: 

$('input.autocomplete').autocomplete({
    data: {
        "Apple": null,
        "Microsoft": null,
        "Google": 'https://placehold.it/250x250'
    },
});

Опция data принимает имя строки с необязательной строкой значков.

Вам потребуется извлечь данные автозаполнения перед инициализацией автозаполнения и предоставитьданные к нему при инициализации: 

$(document).ready(function(){
    $(document).on('input', 'input.autocomplete', function() {
        let inputText = $(this).val();

        $.get('suggest.php?key=' + inputText)
            .done(function(suggestions) {
                $('input.autocomplete').autocomplete({
                    data: suggestions
                });
            });
    });
});

Также вам нужно будет адаптировать suggest.php для генерации JSON в формате, необходимом для опции data автозаполнения.Поэтому вам нужно изменить свой код следующим образом: 

while($row = $res->fetch_assoc()){
    $lname[trim($row["lname"])] = null;
}

РЕДАКТИРОВАТЬ: Кроме того, вы инициализируете свой массив с именем $array, но добавьте материал в несуществующий массив с именем $lname.Вы должны изменить $array = array(); на $lname = array();

...