Автозаполнение PHP, MySQL и Jquery. Автозаполнение

1. ПОДКЛЮЧЕНИЕ К БАЗЕ ДАННЫХ MYSQL
2. ФУНКЦИИ КОНТАКТ И ОТКЛЮЧЕНИЕ
3. Я СОЗДАЮ ФУНКЦИЮ ДЛЯ РЕАЛИЗАЦИИ ПОИСКА
4. МЫ НАЧИНАЕМ ТЕКСТ ДЛЯ САМОПОЛНЕНИЯ
5. МЫ СОБИРАЕМ HTML-ЧАСТЬ
6. HTML ТЕЛО

Эта статья является продолжением Учебник по созданию поисковой системы PHP для очень простой сети ', в значительной степени из-за большого количества запросов, спрашивающих нас, как обогатить поисковую систему функцией автозаполнения в PHP, MySQL и Jquery .

Это правда, что системы автозаполнения присутствуют в большинстве входов или блоков ввода, в дополнение к облегчению пользователю управления, способствующего хорошему пользовательскому опыту ( удобство и простота использования ).

Теперь важно разработать быстрые и эффективные системы, которые не должны потреблять слишком много ресурсов, чтобы избежать раздражающего пользователя времени ожидания, пока решаются системы автозаполнения.

С одной стороны, мы рекомендуем выбрать правильная архитектура для БД MySQL а с другой стороны, чтобы минимизировать доступ к базе данных, мы получим большую скорость.

Как в нашей предыдущей статье, посвященной поисковой системе, мы будем продолжать использовать базу данных провинций в Испании, и на этот раз мы будем поддерживать силу, предлагаемую универсальной галереей JQuery Как гласит его девиз: «пиши меньше, делай больше».

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

1. ПОДКЛЮЧЕНИЕ К БАЗЕ ДАННЫХ MYSQL

В начале программы мы определяем соединение с базой данных, в отличие от нашего предыдущего поста, здесь мы будем подключаться в соответствии с директивой новой версии PHP 7

<? php // Сначала мы определяем соединение с базой данных, чтобы при необходимости было легко изменить параметры. define ('HOST_DB', 'localhost'); // Имя хоста, обычно localhost define ('USER_DB', 'root'); // Пользователь bbdd define ('PASS_DB', ''); // Пароль определения bbdd ('NAME_DB', 'spainprov'); // Имя bbdd?>

2. ФУНКЦИИ КОНТАКТ И ОТКЛЮЧЕНИЕ

Еще раз, чтобы облегчить будущие действия, я определяю функции для открытия или закрытия соединения с базой данных, хотя для примера это может быть чрезмерно, это очень хорошая практика, чтобы всегда способствовать безопасности.

<? php // Определяем функцию соединения (версия PHP 7) connect () {global $ connection; // Глобальное определение, которое будет использоваться во всем контексте $ connection = mysqli_connect (HOST_DB, USER_DB, PASS_DB, NAME_DB) или die ('МОТОР БАЗЫ ДАННЫХ НЕ ПОДКЛЮЧЕН'); mysqli_select_db ($ connection, NAME_DB) или die («БАЗА ДАННЫХ НЕ НАЙДЕНА». NAME_DB); } функцияnect () {global $ connection; mysqli_close ($ connection); }?>

3. Я СОЗДАЮ ФУНКЦИЮ ДЛЯ РЕАЛИЗАЦИИ ПОИСКА

В нашем случае мы хотим завершить или лучше выполнить автоматическое заполнение поля поиска с провинциями по мере ввода, если вам нужно использовать другие таблицы для других полей или внести изменения в будущем, нам просто нужно вернуться к этой функции и обновить ее.

<? php function options () {global $ connection; // Переменная, которая будет содержать результат поиска $ text = ''; подключиться (); mysqli_set_charset ($ connection, 'utf8'); // указать bbdd, что мы собираемся показать информацию в utf8 // Продолжить сбор информации обо всех провинциях $ sql = "SELECT * FROM провинция ORDER BY провинция"; $ result = mysqli_query ($ connection, $ sql); // Выполнение запроса // Если есть результаты ... if (mysqli_num_rows ($ result)> 0) {while ($ row = mysqli_fetch_assoc ($ result)) {// информация собирается так, как мы собираемся передать ее переменная javascript $ text. = '"'. $ row ['Province']. '",'; }} else {$ text = "НЕТ РЕЗУЛЬТАТОВ В BBDD"; } // После работы с bbdd мы закрываем соединение (из соображений безопасности не оставляем открытых соединений) mysqli_close ($ connection); вернуть текст $; }?>

4. МЫ НАЧИНАЕМ ТЕКСТ ДЛЯ САМОПОЛНЕНИЯ

Мы передаем результат поиска, который мы выполняем по интересующему нас тексту, переменной «вызывающей функцию options ()», в нашем случае мы передадим провинции, содержащие нашу таблицу, и предоставим правильный формат, чтобы может использоваться в части javaScript, например: "Альбасете", "Алава", ...

$ options = options ();

5. МЫ СОБИРАЕМ HTML-ЧАСТЬ

Мы определяем заголовок с вызовами соответствующих скриптов и CSS.

<! doctype html>
<Html>
<Head>
<meta charset = »utf-8">
<title> Поисковая система php autocompletado - WebReunidos </ title>

// Часть, соответствующая Jquery

// Переменная, которая собирает результат запроса в таблице Provincias, Jquery будет работать над этим результатом, чтобы динамизировать операцию.
var availableTags = [<? php echo $ options?>];
$ («#Buscador») .autocomplete ({
источник: доступные теги
});
});
</ script>
</ head>

6. HTML ТЕЛО

Наконец, мы включаем INPUT, который будет выполнять эту работу, чтобы он автоматически завершал PHP .

<Body>

<div class = »ui-widget»>
<label for = »поисковая система»> поисковая система: </ label>
<input id = »поисковая система»>
</ div>

</ body>
</ html>

С помощью этого кода мы можем оптимизировать работу нашего поискового движка php, как мы уже говорили в начале этой статьи, и надеемся, что это будет очень полезно.

Lt;?
Lt;?
Php echo $ options?