1

Тема: Аналог живого поиска

Нужна помощь с аяксом. В форме есть поле "фамилия". Мне нужно сделать это поле в виде выпадающего списка, но проблема в том что фамилий в базе довольно много. Помогите с написанием скрипта, чтобы к примеру я ввёл 3 символа и он вывел мне  не больше 5 подходящих фамилий.

2

Re: Аналог живого поиска

Пример смотрите здесь: http://jqueryui.com/autocomplete/
Скрипт на стороне сервера, который будет формировать данные выборки, необходимо писать самостоятельно. Сложного там особо ничего нет, начните со статического файла.

3

Re: Аналог живого поиска

  <script>
  $(function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  });
  </script>
          <div class="ui-widget">
  <label for="tags">Tags: </label>
  <input id="tags" />
</div>

Подскажите в чём проблема, в поле не появляются варианты для автозаполнения

4

Re: Аналог живого поиска

В тег head необходимо добавить подключение скриптов.

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

5

Re: Аналог живого поиска

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.js"></script>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="scripts.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.2.1.js"></script>
<script type="text/javascript" src="jquery.autocomplete.js"></script>

Вот подключенные скрипты, но работать всё равно отказывается

6 (изменено: S3Ga, 2013-05-22 20:16:05)

Re: Аналог живого поиска

Всё заработало.Убрал лишние ненужные библиотеки. Но теперь не знаю как сделать чтобы автозаполнение происходило из внешнего файла.http://api.jqueryui.com/autocomplete/#option-source на сайте нет такого примера

7

Re: Аналог живого поиска

Пример здесь: http://jqueryui.com/autocomplete/#remote
Файл search.php генерирует данные в формате JSON. Пока сделайте статический файл, чтобы понять как это работает, затем сможете сформировать экспорт нужных данных в формат JSON.

8

Re: Аналог живого поиска

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

9 (изменено: Hanut, 2015-02-01 20:47:34)

Re: Аналог живого поиска

может кто подсказать как в этом скрипте сделать выдачу по алфавиту?

Пробуйте посмотреть документацию по запросам к Яндексу. http://help.yandex.ru/search/query-lang … nguage.xml

10

Re: Аналог живого поиска

Hanut сказал:

Пробуйте посмотреть документацию по запросам к Яндексу.

wink  к сожалению такой ответ ни о чем мне не сказал. на столько я видимо новичек)) Все равно спасибою