Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 04.11.2016, 12:51
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

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

Из всего сказано ясно, что именно живой поиск вам и нужен, а "могли ТОЛЬКО выбирать из предлагаемого списка вариантов", это и есть ваше ограничение, и имеет иной смысл.

Сообщение от veg
autocomplete у меня вообще OFF стоит.
Это атрибут формы/полей, а таким же образом называют и плагины которые и занимаются живым поиском, Их наплодили уже достаточно много, можете для интереса найти и просмотреть их демонстрации.

А теперь по вашему.

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

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

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

$i=0;
while ($row = $db_referal -> fetch_array()) {
$i++;

Зачем этот не нужный счетчик? Сам результат запроса уже отвечает на этот вопрос - есть ли записи или нет - $db_referal->num_rows(). Если вернется более 0, значит есть совпадения, и сразу отдаем клиенту весь набор как JSON, если вместо $db_referal->fetch_array() использовать $db_referal->fetch_all():

$db_referal = $mysqli -> query("SELECT field_id, field_name from ".PREFIX."city WHERE city LIKE '%$referal%'"); //надеюсь баг с дырой будет исправлен
//отдаем клиенту результат и выход
exit(json_encode($db_referal->num_rows() ? $db_referal->fetch_all() : null));
//или проще, так как если не будет найдено то будет возвращен пустой массив
//и проверять количество возвращенный записей нет необходимости
exit(json_encode($db_referal->fetch_all() ?: null));


На клиенте:

//response выбросить
dataType: 'json',
success: function(data){
                    if($data) //строим и показываем список по полученным данным
                    else //ничего не найдено, списка не будет
                }


И еще раз - отдавать клиенту html с намеренно добавленным \n, кстати в Win, это \r\n (в РНР для этого есть константа PHP_EOL, она сама разберется что конкретно на платформе) это просто бессмысленно, мусор это. Идеальный html, это одна длиииииинная строка, а структуру его всегда можно просмотреть в отладчике.

Последний раз редактировалось laimas, 04.11.2016 в 12:57.
Ответить с цитированием
  #12 (permalink)  
Старый 04.11.2016, 14:50
veg veg вне форума
Аспирант
Отправить личное сообщение для veg Посмотреть профиль Найти все сообщения от veg
 
Регистрация: 05.04.2012
Сообщений: 43

Цитата:
Города в базе нужно держать в отдельной таблице под уникальным идентификатором каждый. Вывод списка городов, это вывод названия города как текста опции, а его идентификатора как ее значения.
Так и есть. У каждого города есть свой идентефикатор, но это следующим шагом хотел сделать. До это был выпадающий список городов (<select>), но так как количество городов около 1000, и листать в поисках нужного не есть хорошо, решил прибегнуть к варианту из-за которого собственно тема и открылась. Пользователь мог выбрать город, а обработчику передавался id этого города.
Снимок.JPG
Цитата:
Если пользователь осведомлен, что он не может ввести произвольный город, а список предложений будет только в случае найденного, то сообщать что ничего не найдено большого смысла нет. Просто списка естественно не будет в этом, что и есть результат "не найдено", разве это не понятно и без сообщения?
Пользователь не осведомлен. Он узнает об этом только тогда, когда выйдет сообщение о том, что город не найден.

Получилось следующее. Реакции на ввод данных нет.
$db_referal = $mysqli -> query("SELECT id,city from ".PREFIX."city WHERE city LIKE '%$referal%'");

 exit(json_encode($db_referal->fetch_all() ?: null));


data: 'json',
                success: function(data){
                     //Выводим полученные данные в списке
					 if($data) {$(".search_result").html(data).fadeIn();}//строим и показываем список по полученным данным
					 else {}//ничего не найдено, списка не будет

                }

Последний раз редактировалось veg, 04.11.2016 в 15:25.
Ответить с цитированием
  #13 (permalink)  
Старый 04.11.2016, 15:27
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Заходим на страничку Гугла, Яшки, Бинг и прочих, начинаем поиск - есть ли список предложений, если робот ничего не найдет? Тоже самое и у вас. А пользователь должен знать сразу, что он может выбрать только тот город, который у вас оговорен условиями. Живой же поиск, это как раз сервис, чтобы не выводить длинную портянку, и не иметь представления о том как он работает в данное время может только пьяный ежик. )
Хотите еще и контрольный выстрел, ну так причем тут не найдено? Тогда уже сообщайте пользователю, что данный город (введенный пользователем) ваш сайт не принимает/не одобряет/или иная какая-то причина, иначе как же он узнает почему не может ввести произвольное? Уж как-то надо поставить в известность бедного пользователя.

Сообщение от veg
Реакции, на ввод данных, нет.
И не будет - я вам показал кодом, что сервер возвращает не готовый html-список, а json-строку, которую jQuery преобразует в объект. Это в случае если будут найдены совпадения. Объект (data) - это будет массив объектов, то есть запрос возвращает id и city поля, и объект будет например такой:

data = [
  {"id" : 12, "city" : "Волгоград"},
  {"id" : 15, "city" : "Воронеж"},
   ......
]


Этот массив объектов нужно обойти циклом и построить по ним список. Или не известно как это делается, да еще посредством JQ?

А если data пуст, значит нет и списка, а уж надо сообщать и что при этом решайте сами.

Примечание: если JSON и показанный код ответа, то fetch_all(MYSQLI_ASSOC). Не используйте fetch_array() если в этом нет необходимости, это на будущее.

Чтобы объект был именно таким {"id" : 12, "city" : "Волгоград"}, нужно указать параметры кодирования:

exit(json_encode($db_referal->num_rows() ? $db_referal->fetch_all() : null, JSON_NUMERIC_CHECK | JSON_UNESCAPED_UNICODE));


если они доступны - первый с 5.3.3, второй с 5.4.0

Последний раз редактировалось laimas, 04.11.2016 в 15:36.
Ответить с цитированием
  #14 (permalink)  
Старый 04.11.2016, 16:05
veg veg вне форума
Аспирант
Отправить личное сообщение для veg Посмотреть профиль Найти все сообщения от veg
 
Регистрация: 05.04.2012
Сообщений: 43

С json работал, только средствами php все обрабатывал.
Сделал так. Все выводится, сейчас буду допиливать.

$(function(){
    
    //Живой поиск
    $('.who').bind("change keyup input click", function() {
        if(this.value.length >= 2){
            $.ajax({
                type: 'post',
                url: "search.php", //Путь к обработчику
                data: ({'referal':this.value,'id':this.id}),
                response: 'text',
                success: function(data){
                    $(".search_result").html(data).fadeIn(); //Выводим полученые данные в списке
                }
            })
        }
		
		
    })
    
    $(".search_result").hover(function(){
        $(".who").blur(); //Убираем фокус с input
    })
    
    //При выборе результата поиска, прячем список и заносим выбранный результат в input
    $(".search_result").on("click", "li span", function(){
        s_user = $(this).value;
		s_id =  $(this).id;
		$(".search_result").fadeOut();
        $(".who").val(s_user); //деактивируем input, если нужно
        
    })

})


$db_referal = $mysqli -> query("SELECT id,city from ".PREFIX."city WHERE city LIKE '%$referal%'");
    
	
	exit(json_encode($db_referal->fetch_all() ?: null,JSON_NUMERIC_CHECK | JSON_UNESCAPED_UNICODE));

Последний раз редактировалось veg, 04.11.2016 в 16:44.
Ответить с цитированием
  #15 (permalink)  
Старый 04.11.2016, 16:58
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Пусть сервер вернул показанное в примере на ввод "во", стоим список:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script> 
$(function() {
//это вернул сервер в success
var data = [
  {"id" : 12, "city" : "Волгоград"},
  {"id" : 15, "city" : "Воронеж"}
];
//success обработчик
var ul = $('ul.search_result');
$.each(data, function() {
    ul.append('<li data-id="' + this.id + '">' + this.city + '</li>')
})
});
</script>     
</head> 
<body>
<ul class="search_result"></ul>
</body> 
</html>


Список строится?

Почему без ID? Или вы намерены вместо идентификаторов использовать имена? В скрытое поле нужно передвать идентификатор. А можно и в LI спрятать радио кнопки с label, и значение у которых есть идентификаторы, значение выбранной кнопка будет отправлено серверу.
Ответить с цитированием
  #16 (permalink)  
Старый 04.11.2016, 17:12
veg veg вне форума
Аспирант
Отправить личное сообщение для veg Посмотреть профиль Найти все сообщения от veg
 
Регистрация: 05.04.2012
Сообщений: 43

Да. Список выводится в таком формате.
Снимок.JPG
ID хочу занести в скрытый input
Ответить с цитированием
  #17 (permalink)  
Старый 04.11.2016, 17:45
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от veg
ID хочу занести в скрытый input
Ну так чтобы его занести по выбору пользователя, его же нужно получить и получить выбранного города, а значит идентификаторы городов нужно помещать в атрибуты списка, например как я показал. У вас же не видно, что они вообще используются.
Ответить с цитированием
  #18 (permalink)  
Старый 04.11.2016, 18:05
veg veg вне форума
Аспирант
Отправить личное сообщение для veg Посмотреть профиль Найти все сообщения от veg
 
Регистрация: 05.04.2012
Сообщений: 43

Ну список выше прислал, ID в li занесен будет конечно, я пока разбираюсь с json.
Не выводит список когда добавил Ваш код.
url: "search.php", //Путь к обработчику
                data: ({'referal':this.value,'id':this.id}),
                
                success: function(){
					
					var ul = $('ul.search_result');
						$.each(data, function() {
						ul.append('<li data-id="' + this.id + '">' + this.city+ '</li>')

						});
                    $(".search_result").html(data).fadeIn(); //Выводим полученые данные в списке
Ответить с цитированием
  #19 (permalink)  
Старый 04.11.2016, 18:54
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Поиск в базе осуществляется по введенному пользователем тексту, откуда у "неизвестного еще для сервера" может оказаться ID?

data: ({'referal':this.value,'id':this.id}) - с чего это тут появилось и откуда?

Полученное нужно обработать, data, это аргумент функции обработчика, куда он исчез? То что у меня в примере это объявлено как глобальная переменная, так это только для примера, чтобы его можно было запустить для просмотра.

dataType : 'json', //обязательно или если не указывать, то сервер должен передавать соответствующий заголовок
success: function(data){
    if(data) { //если найдены совпадения 
        var ul = $('ul.search_result').empty().show(); //эффекты типа fadeIn() вряд ли уместны здесь
        //это и есть добавление в список
        $.each(data, function() {
            ul.append('<li data-id="' + this.id + '">' + this.city+ '</li>')
        });
        //а $(".search_result").html(data) при том что data есть объект, это чушь
        //о fadeIn() выше сказано
    } else {
        //действия в случае если не найдено совпадений
    }
}

Последний раз редактировалось laimas, 04.11.2016 в 19:14.
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как реализовать динамичное добавление тегов modelfak23 jQuery 1 19.06.2015 14:27
Как правильно реализовать такой функционал? Julian Общие вопросы Javascript 3 16.01.2015 12:34
Как правильно реализовать наследование? Universe Общие вопросы Javascript 9 10.04.2014 16:05
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 13:29
Как реализовать? Fliand Элементы интерфейса 4 22.08.2009 19:47