[ticket/10737] Using JQuery events and JSON response.

PHPBB3-10737
suheb · Mar 9, 2014 · 891461e · 891461e
1 parent 8bf234b
commit 891461e
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 50 deletions.
diff --git a/phpBB/assets/javascript/core.js b/phpBB/assets/javascript/core.js
@@ -512,6 +512,32 @@ phpbb.timezonePreselectSelect = function(forceSelector) {
 	}
 };
 
+// Listen live search box events
+$('.liveinput').keyup(function() {
+	var str = this.value;
+	var j = 0;
+	if (str.length < 3) { 
+		  $("#livesearch").innerHTML="";
+		  return;
+		}
+
+	$.ajax({
+		url:'memberlist.php?mode=livesearch&'+"&q="+str,
+		success:function(result) {
+				$.each(result, function(idx, elem) {
+					j = (idx%2)+1;
+					$("#livesearch").append("<tr class='bg" + j + " row" + j + "'><td><a href='memberlist.php?mode=viewprofile&u=" + elem.id + "' target='_blank'>" + elem.name + "</a></td></tr>");
+				})
+				}
+	});
+});
+
+$('.liveinput').blur(function() {
+		setTimeout(function () {
+        	document.getElementById("livesearch").innerHTML="";
+		}, 500);	
+});
+
 // Toggle notification list
 $('#notification_list_button').click(function(e) {
 	$('#notification_list').toggle();

diff --git a/phpBB/memberlist.php b/phpBB/memberlist.php
@@ -992,25 +992,24 @@
 
 	case 'livesearch':
 		$username_chars = $request->variable('q', '', true);
-		$hint = "";
 
 		$sql = 'SELECT username, user_id
 			FROM ' . USERS_TABLE . '
 			WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
 				AND username ' . $db->sql_like_expression($username_chars . $db->any_char);
 		$result = $db->sql_query_limit($sql, 10);
 
+		$user_list = array(); 
 		$i = 1;
 		while ($row = $db->sql_fetchrow($result))
 		{	
 			$j = ($i%2)+1;
-			$hint.= "<tr class='bg".$j." row".$j."'><td><a href='" . 
-				$phpbb_root_path."memberlist.$phpEx". "?mode=viewprofile&u=" . $row['user_id'] . 
-				"' target='_blank'>" . 
-				$row['username'] . "</a></td></tr>";
+			$user_list[] = array("id" => $row['user_id'], "name" => $row['username']);
 			$i++;
 		}
-		echo $hint;
+
+		$json_response = new \phpbb\json_response();
+		echo $json_response->send($user_list);
 		exit();
 	break;
 

diff --git a/phpBB/styles/prosilver/template/memberlist_search.html b/phpBB/styles/prosilver/template/memberlist_search.html
@@ -1,24 +1,3 @@
-<script>
-	function showHint(str) { 
-		if (str.length<3) { 
-		  document.getElementById("livesearch").innerHTML="";
-		  return;
-		}
-
-		$.ajax({
-			url:'{S_LIVE_SEARCH_ACTION}'+"&q="+str,
-			success:function(result) {
-					$("#livesearch").html(result);
-					}
-				});
-	}
-	function clearSearch() {	
-		setTimeout(function () {
-        	document.getElementById("livesearch").innerHTML="";
-		}, 500);	
-	}
-</script>
-
 <h2 class="solo">{L_FIND_USERNAME}</h2>
 
 <form method="post" action="{S_MODE_ACTION}" id="search_memberlist">
@@ -30,7 +9,7 @@ <h2 class="solo">{L_FIND_USERNAME}</h2>
 	<fieldset class="fields1 column1">
 	<dl>
 		<dt><label for="username">{L_USERNAME}{L_COLON}</label></dt>
-		<dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox" autocomplete="off" onkeyup="showHint(this.value)" onblur="clearSearch()" /> <table class="table1" id="livesearch"></table> </dd>
+		<dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox liveinput" autocomplete="off" /> <table class="table1" id="livesearch"></table></dd>
 	</dl>
 <!-- IF S_EMAIL_SEARCH_ALLOWED -->
 	<dl>

diff --git a/phpBB/styles/subsilver2/template/memberlist_search.html b/phpBB/styles/subsilver2/template/memberlist_search.html
@@ -64,27 +64,6 @@
 	</script>
 <!-- ENDIF -->
 
-<script>
-	function showHint(str) { 
-		if (str.length<3) { 
-		  document.getElementById("livesearch").innerHTML="";
-		  return;
-		}
-
-		$.ajax({
-			url:'{S_LIVE_SEARCH_ACTION}'+"&q="+str,
-			success:function(result) {
-					$("#livesearch").html(result);
-					}
-				});
-	}
-	function clearSearch() {	
-		setTimeout(function () {
-        	document.getElementById("livesearch").innerHTML="";
-		}, 500);		
-	}
-</script>
-
 <form method="post" action="{S_MODE_ACTION}" name="search">
 
 <table class="tablebg" width="100%" cellspacing="1">
@@ -96,7 +75,7 @@
 </tr>
 <tr>
 	<td class="row1"><b class="genmed">{L_USERNAME}{L_COLON}</b></td>
-	<td class="row2"><input class="post" type="text" name="username" value="{USERNAME}" autocomplete="off" onkeyup="showHint(this.value)" onblur="clearSearch()" /> <table class="tablebg" id="livesearch"></table> </td>
+	<td class="row2"><input class="post liveinput" type="text" name="username" value="{USERNAME}" autocomplete="off" /> <table class="tablebg" id="livesearch"></table></td>
 	<td class="row1"><b class="genmed">{L_ICQ}{L_COLON}</b></td>
 	<td class="row2"><input class="post" type="text" name="icq" value="{ICQ}" /></td>
 </tr>