Как мне реализовать поиск?

Question

У меня полуфункциональный сайт. У меня не работает панель поиска. Я хочу, чтобы пользователь мог вводить имя человека. Затем я хочу, чтобы строка поиска возвращала имя и фотографию человека в onkeydown (). В основном, как Facebook.

Для этого потребуется XHTML / CSS, аналогичный выпадающему меню, но с запросом к таблице mysql. Facebook запрашивает как имя, так и фамилию, что объясняет, почему они не объединяют два типа, как это делает твиттер У меня только полное имя вставлено, чтобы облегчить это Я отправлю каждое письмо и сопоставлю его с полным столбцом mysql. Как вы пишете регулярные выражения для этого или более высокого уровня - как вы пишете функцию для этого?

PHP - псевдокод

function match()
  {
  //  Run Query
  //  Return list(full_name,picture)
  //  If less then 5
         Modify up query to obtain 5
         Embedded if (special case less then 5 available - new site)
           Send
      If more then 5
         Modify down query to obtain 5
      Elseif ==5
         Send

  }

CSS / XHTML / Javascript

function display()
  {
  // Display list - set max returns (5)
  }

Answer 1

Ознакомьтесь с функцией автозаполнения jQueryUI, в частности, Удаленный источник данных и Пользовательские данные и отображение примеры.

На стороне PHP вы захотите

1. Запрос к базе данных на основе предоставленных поисковых данных
2. Создание массива соответствующих записей
3. Показать этот массив как данные JSON, используя json_encode()

Обновление

Изменено в селекторе автозаполнения моего друга на Facebook.

Вот ядро ​​JavaScript

jQuery(function($) {
    var field = $('#friend-name'); // text field for name
    var idField = $('#friend-id'); // hidden field for ID
    field.autocomplete({
        minLength: 3,
        width: 240,
        source: 'search.php',
        change: function(event, ui) {
            idField.val(ui.item != null ? ui.item.id : '');
            return true;
        }
    }).data('autocomplete')._renderItem = function(ul, item) {
        var img = '<img src="' + item.picture + '">';
        return $('<li>')
               .data('item.autocomplete', item)
               .append('<a>' + item.label + img + '</a>')
               .appendTo(ul);
    };
});

PHP-часть для поиска по параметрам будет выглядеть примерно так

// search.php

// assuming PDO connection already made in $db
$stmt = $db->prepare('SELECT `id`, `name`, `picture` FROM `Person` WHERE LOWER(`name`) LIKE ?');
$stmt->execute(array(
    strtolower($_GET['term'] . '%')
));
$people = array();
while($person = $stmt->fetch(PDO::FETCH_ASSOC)) {
    $people[] = array(
        'label'   => $person['name'],
        'value'   => $person['name'],
        'picture' => $person['picture'],
        'id'      => $person['id']
    );
}
echo json_encode($people);