Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.03.2015, 11:24
Интересующийся
Отправить личное сообщение для Jigan2 Посмотреть профиль Найти все сообщения от Jigan2
 
Регистрация: 13.03.2015
Сообщений: 29

Подскажите по аякс поиску
Здравствуйте уважаемые! Вот изобретаю велосипед по быстрому поиску пользователями среди своих друзей в чате. Есть такой код:

<div class="friend-header"><input id="search_input" class="friend-search" type="text" placeholder="Поиск друзей..." onkeyup="friend_search(this.value);" maxlength="100" autocomplete="off"><div id="search_button"><i class="icon-search cursor-hand" onclick="$(" .friend-search").focus();"=""></i></div></div>


	function friend_search(query) {
	var ajax_timeout;
	var obj_search_user_list = $("#search_user_list");
   
	if(query.length == 0) {
		obj_search_user_list.hide();
		$("#user_list").show();
		$("#search_button").empty();
		$("#search_button").prepend('<i class="icon-search cursor-hand" onclick="$(".friend-search").focus();"></i>');
		obj.find('#user_list > .select_user').prependTo($('#user_list'));
		$(".scroll_bar").customScrollbar("resize", true);
        show_chat();
		//clearTimeout(ajax_timeout_search);
		//clearTimeout(ajax_timeout);
		//ajax_timeout.abort();
		//ajax_timeout_search.abort();
		return false;
	} 
	
		$("#search_button").empty();
		$("#search_button").prepend("<div class='loading-search'></div>");

        ajax_timeout = setTimeout(function() {
			var ajaxurl = CHAT_SITE_URL+'/index.php?act=web_chat&op=search_friend&n=99&f_id='+user['u_id']+'&q='+query;
			$.ajax({
			type: "GET",
			url: ajaxurl,
			dataType:"jsonp",
			async: false,
            cache: false,
			success: function(friend_list){	
				obj_search_user_list.empty();
				$("#search_button").empty();
				$("#search_button").prepend('<div class="clear-search"></div>');
			    for (var u_id in friend_list){
			        var class_html = 'offline';
			        if ( user_list[u_id]['online'] > 0 ) class_html = 'online';
			           obj_search_user_list.prepend('<li class="user" select_u_id="'+u_id+'" onclick="show_message('+u_id+');"><i class="'+class_html+'"></i><span class="user-avatar avatar-'+user_list[u_id]['online']+'" title="'+user_list[u_id]['u_name']+'"><img alt="'+user_list[u_id]['u_name']+'" src="'+user_list[u_id]['avatar']+'"></span><span class="user-name" title="'+user_list[u_id]['u_name']+'">'+user_list[u_id]['u_name']+'<em></em></span><em unread_id="'+u_id+'" class=""></em></li>');
			    }
			},
			complete: function() {
				$("#user_list").hide();
			    obj_search_user_list.show();
			    //getconnect();
				$(".loading-search").remove();
			    $(".scroll_bar").customScrollbar("resize", true);
            }
			});
		}, 500);	
    }


public function search_friendOp() {
		$model_chat	= Model('web_chat');
		$f_id = intval($_GET['f_id']);
		$n = intval($_GET['n']);
		$member_list = $model_chat->getFriendList(array('friend_frommid'=> $f_id, 'friend_tomname' => array('like','%'.trim($_GET['q']).'%')),$n,$member_list);
		$this->json($member_list);
	}


Подскажите как можно улучшить данный код, в плане нагрузки на базу.
И еще интересует как сделать запуск функции только когда пользователь ввел последнюю букву и остановился, а то сейчас при каждой введенной буквы запрос отправляется. И еще как сделать что бы при удалении символов из поля поиска до 0 скрипт не выполнялся, а то быстро удалишь и запрос все равно выполняется. Заранее благодарен!
Ответить с цитированием
  #2 (permalink)  
Старый 13.03.2015, 11:43
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Оператор LIKE использует символы _ и % как спецсимволы, и если таковые будут в запросе, оператор может выдать некорректный результат. И слеши используемые в выражении для поиска нужно удваивать. Поэтому данные для LIKE нужно предварительно обработать:

array('like','%'.addCslashes(trim($_GET['q']), '\%_').'%')),$n,$member_list);


В плане нагрузки на базу - так ваш код, это живой поиск, иначе бы просто SELECT по полю индексированному.

как сделать запуск функции только когда пользователь ввел последнюю букву

А какой считать последнюю, разве можно на это ответить однозначно? Можно по таймеру определять - нет определенного времени нажатий, значит запрос. Можно и через N введенных символов делать запрос, но в этом случае, если введено меньшее количество, то запроса вообще не будет.

И еще как сделать что бы при удалении символов из поля поиска до 0 скрипт не выполнялся


Это проще - длину строки проверять.
Ответить с цитированием
  #3 (permalink)  
Старый 13.03.2015, 11:59
Интересующийся
Отправить личное сообщение для Jigan2 Посмотреть профиль Найти все сообщения от Jigan2
 
Регистрация: 13.03.2015
Сообщений: 29

Цитата:
Можно по таймеру определять - нет определенного времени нажатий, значит запрос.
Покажите пожалуйста на примере как это реализовать, а то я недавно js начал изучать.
Ответить с цитированием
  #4 (permalink)  
Старый 13.03.2015, 12:16
Интересующийся
Отправить личное сообщение для Jigan2 Посмотреть профиль Найти все сообщения от Jigan2
 
Регистрация: 13.03.2015
Сообщений: 29

Подсмотрел тут .keyup() задержка и отправка одного запроса после нескольких нажатий и сделал так:
function searchGo(query) {
	var obj_search_user_list = $("#search_user_list");
	
			var ajaxurl = CHAT_SITE_URL+'/index.php?act=web_chat&op=search_friend&n=99&f_id='+user['u_id']+'&q='+query;
			$.ajax({
			type: "GET",
			url: ajaxurl,
			dataType:"jsonp",
			async: false,
            cache: false,
			success: function(friend_list){	
				obj_search_user_list.empty();
				$("#search_button").empty();
				$("#search_button").prepend('<div class="clear-search"></div>');
			    for (var u_id in friend_list){
			        var class_html = 'offline';
			        if ( user_list[u_id]['online'] > 0 ) class_html = 'online';
			           obj_search_user_list.prepend('<li class="user" select_u_id="'+u_id+'" onclick="show_message('+u_id+');"><i class="'+class_html+'"></i><span class="user-avatar avatar-'+user_list[u_id]['online']+'" title="'+user_list[u_id]['u_name']+'"><img alt="'+user_list[u_id]['u_name']+'" src="'+user_list[u_id]['avatar']+'"></span><span class="user-name" title="'+user_list[u_id]['u_name']+'">'+user_list[u_id]['u_name']+'<em></em></span><em unread_id="'+u_id+'" class=""></em></li>');
			    }
			},
			complete: function() {
				$("#user_list").hide();
			    obj_search_user_list.show();
			    //getconnect();
				$(".loading-search").remove();
			    $(".scroll_bar").customScrollbar("resize", true);
            }
			});
		return false;
    }
	var ajax_timeout;
	function friend_search(query) {
		if(query.length == 0) {
			window.clearTimeout(ajax_timeout);
			$("#search_user_list").hide();
			$("#user_list").show();
			$("#search_button").empty();
			$("#search_button").prepend('<i class="icon-search cursor-hand" onclick="$(".friend-search").focus();"></i>');
			obj.find('#user_list > .select_user').prependTo($('#user_list'));
			$(".scroll_bar").customScrollbar("resize", true);
            show_chat();
			return false;
		} else {
			$("#search_button").empty();
		    $("#search_button").prepend("<div class='loading-search'></div>");
			window.clearTimeout(ajax_timeout);
            ajax_timeout = setTimeout(function() {
		    searchGo (query);
	        },500);
        }
    }

Теперь при быстром наборе отправляется один запрос. При удалении не выполняется ни одного.
Ответить с цитированием
  #5 (permalink)  
Старый 13.03.2015, 12:22
Интересующийся
Отправить личное сообщение для Jigan2 Посмотреть профиль Найти все сообщения от Jigan2
 
Регистрация: 13.03.2015
Сообщений: 29

По поводу этого кода подскажите подробнее как улучшить, а то я что то не понял:

public function search_friendOp() {
		$model_chat	= Model('web_chat');
		$f_id = intval($_GET['f_id']);
		$n = intval($_GET['n']);
		$member_list = $model_chat->getFriendList(array('friend_frommid'=> $f_id, 'friend_tomname' => array('like','%'.trim($_GET['q']).'%')),$n,$member_list);
		$this->json($member_list);
	}
Ответить с цитированием
  #6 (permalink)  
Старый 13.03.2015, 16:07
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Да нечего в ней улучшать, про LIKE я говорил, единственное что бы сделал, так это выбросил определения совсем не нужных промежуточных переменных, и написал бы так:

public function search_friendOp() {
        $model_chat = Model('web_chat');
        $member_list = $model_chat->getFriendList(array('friend_frommid'=> (int)$_GET['f_id'], 'friend_tomname' =>array('like','%'.addCslashes(trim($_GET['q']), '\%_').'%')),(int)$_GET['n'],$member_list);
        $this->json($member_list);
}


А если скрипт работает под РНР 5.4 или выше, не array(), а [].

Последний раз редактировалось laimas, 13.03.2015 в 16:14.
Ответить с цитированием
  #7 (permalink)  
Старый 13.03.2015, 17:54
Интересующийся
Отправить личное сообщение для Jigan2 Посмотреть профиль Найти все сообщения от Jigan2
 
Регистрация: 13.03.2015
Сообщений: 29

Сообщение от laimas Посмотреть сообщение
Да нечего в ней улучшать, про LIKE я говорил, единственное что бы сделал, так это выбросил определения совсем не нужных промежуточных переменных, и написал бы так:

public function search_friendOp() {
        $model_chat = Model('web_chat');
        $member_list = $model_chat->getFriendList(array('friend_frommid'=> (int)$_GET['f_id'], 'friend_tomname' =>array('like','%'.addCslashes(trim($_GET['q']), '\%_').'%')),(int)$_GET['n'],$member_list);
        $this->json($member_list);
}


А если скрипт работает под РНР 5.4 или выше, не array(), а [].
Благодарю за помощь, сейчас исправлю. Т.е. вместо array('friend_frommid'=> (int)$_GET['f_id'] надо сделать так ['friend_frommid'=> (int)$_GET['f_id']] я правильно понял?
Ответить с цитированием
  #8 (permalink)  
Старый 13.03.2015, 18:10
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Да, если у вас 5.4 или выше, в ней слава богу стало доступно объявлять массивы также просто как и в JS - []. Есть и другие мелкие, но давно желаемые штучки, которые позволяют не писать лишнего совсем не нужного.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Несколько аякс запросов OlegOlegOleg1980 AJAX и COMET 6 15.06.2014 17:21
select в аякс окне ureech AJAX и COMET 0 08.05.2014 15:25
Не правильно работает прокрутка, подскажите как сделать правильно? denfer12 Общие вопросы Javascript 0 09.05.2012 00:34
Подскажите, где ошибка? Вып. меню allasan Элементы интерфейса 2 13.03.2012 01:36
Нужен совет по регистрации через аякс Garik AJAX и COMET 1 19.08.2011 23:31