Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

[ticket/10737] Adding username suggestions in "Find a member" using AJAX #2009

Closed
wants to merge 19 commits into from

7 participants

@suheb

Suggest usernames as the user types in "Find a member" using AJAX.
Ticket: http://tracker.phpbb.com/browse/PHPBB3-10737

phpBB/memberlist.php
@@ -30,7 +30,7 @@
$topic_id = request_var('t', 0);
// Check our mode...
-if (!in_array($mode, array('', 'group', 'viewprofile', 'email', 'contact', 'searchuser', 'leaders')))
+if (!in_array($mode, array('', 'group', 'viewprofile', 'email', 'contact', 'searchuser', 'leaders','livesearch')))
@nickvergessen Collaborator

missing space after , ;)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
@@ -992,7 +992,44 @@
);
break;
-
+
+ case 'livesearch':
+ $q=request_var('q','');
@nickvergessen Collaborator

please use $request->variable('q', '', true);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
@@ -992,7 +992,44 @@
);
break;
-
+
+ case 'livesearch':
+ $q=request_var('q','');
+ $hint="";
+ // Get us some users :D
+ $sql = "SELECT u.user_id
+ FROM " . USERS_TABLE . " u
+ WHERE u.user_type IN (" . USER_NORMAL . ', ' . USER_FOUNDER . ")";
@nickvergessen Collaborator

This needs limitation, we can not put all 100k or more users in an array...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((8 lines not shown))
+ $hint="";
+ // Get us some users :D
+ $sql = "SELECT u.user_id
+ FROM " . USERS_TABLE . " u
+ WHERE u.user_type IN (" . USER_NORMAL . ', ' . USER_FOUNDER . ")";
+
+ $result = $db->sql_query($sql);
+ $user_list = array();
+ while ($row = $db->sql_fetchrow($result))
+ {
+ $user_list[] = (int) $row['user_id'];
+ }
+ $db->sql_freeresult($result);
+ $sql = 'SELECT *
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_id', $user_list);
@nickvergessen Collaborator

merge with the query above...
and only display hints after 3 characters or something like that....

@prototech Collaborator

There's no need to fetch all columns in the table. Should only need the username and user id. The search should also be done in the query instead of selecting all records and iterating through them in PHP to find those that match. The search code should also probably be in its own function as we probably want this elsewhere (eg the ACP, PMs, etc).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((19 lines not shown))
+ }
+ $db->sql_freeresult($result);
+ $sql = 'SELECT *
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_id', $user_list);
+ $result = $db->sql_query($sql);
+ $i=1;
+ while ($row = $db->sql_fetchrow($result))
+ { $j=($i%2)+1;
+ if(stripos($row['username'],$q)===0)
+ {
+ $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>";
+ $i++;
@prototech Collaborator

This should simply be returning the list of users in JSON format instead of hard-coding HTML.

@suheb
suheb added a note

@prototech So I should send a simple JSON response and use it to create table rows in JavaScript?

@prototech Collaborator

The template itself should define the HTML. So what you want to do is have a hidden element within the table in memberlist_search.html. For example:

<tr id="user-search-row-tpl" style="display: none;">
    <td><a class="user-search-link user-search-name" target='_blank'></a></td>
</tr>

Then clone that and insert the relevant data using the classes as selectors.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((25 lines not shown))
+ $i=1;
+ while ($row = $db->sql_fetchrow($result))
+ { $j=($i%2)+1;
+ if(stripos($row['username'],$q)===0)
+ {
+ $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>";
+ $i++;
+ }
+ else
+ $hint.="";
+ }
+ echo $hint;
+ exit();
@prototech Collaborator

Use the send method in the \phpbb\json_response class.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((16 lines not shown))
+ while ($row = $db->sql_fetchrow($result))
+ {
+ $user_list[] = (int) $row['user_id'];
+ }
+ $db->sql_freeresult($result);
+ $sql = 'SELECT *
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_id', $user_list);
+ $result = $db->sql_query($sql);
+ $i=1;
+ while ($row = $db->sql_fetchrow($result))
+ { $j=($i%2)+1;
+ if(stripos($row['username'],$q)===0)
+ {
+ $hint.="<tr class='bg".$j." row".$j."'><td><a href='" .
+ $phpbb_root_path."memberlist.$phpEx". "?mode=viewprofile&u=" . $row['user_id'] .
@prototech Collaborator

This should be passed through append_sid()

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/styles/prosilver/template/memberlist_search.html
((20 lines not shown))
+ if (xmlhttp.readyState==4 && xmlhttp.status==200)
+ {
+ document.getElementById("livesearch").innerHTML=xmlhttp.responseText;
+ document.getElementById("livesearch").style.border="0px";
+ }
+ }
+ xmlhttp.open("GET",'{S_LIVE_SEARCH_ACTION}'+"&q="+str,true);
+ xmlhttp.send();
+ }
+
+ function clearSearch()
+ {
+ document.getElementById("livesearch").innerHTML="";
+ }
+</script>
+
@prototech Collaborator

jQuery is included in the core, so you should be use it to send the request. This should also be in assets/javascript/core.js so it can be reused elsewhere and by all styles.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/styles/prosilver/template/memberlist_search.html
@@ -1,3 +1,38 @@
+<script>
+ function showHint(str)
+ {
+ if (str.length==0)
+ {
+ document.getElementById("livesearch").innerHTML="";
+ document.getElementById("livesearch").style.border="0px";
@prototech Collaborator

If there's a need to do this, it should be done in the stylesheet rather than here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/styles/prosilver/template/memberlist_search.html
@@ -9,7 +44,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" /></dd>
+ <dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox" onkeyup="showHint(this.value)" onblur="clearSearch()" /> <table class="table1" id="livesearch"></table> </dd>
@prototech Collaborator

Use jQuery events.

@prototech Collaborator

This should also have autocomplete="off" otherwise the browser's own suggestions will be overlayed on top.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@prototech
Collaborator

Clicking on one of the usernames doesn't do anything at the moment which makes the usefulness of this rather limited. It should actually fill in the field with that value. If you have to continue typing in the whole username after it has suggested the one that you want, then you're sending unnecessary requests to the server. I see that it's supposed to open the user's profile in another window, but that also doesn't work.

@suheb

@prototech I have added the link of user's profile with the username. Clicking on it opens the user's profile. It's working on my system.

@prototech
Collaborator

I tested in Firefox, Chrome, Opera, and Safari and that doesn't work in any of them.

phpBB/memberlist.php
@@ -992,7 +992,28 @@
);
break;
-
+
+ case 'livesearch':
+ $q=request_var('q', '', true);
@prototech Collaborator

This is still not using the request class.

@suheb
suheb added a note

Ohh.. I missed that.. will do it in next commit.

@prototech Collaborator

The variable name needs to be more descriptive and there should be a space before and after = - http://area51.phpbb.com/phpBB/docs/coding-guidelines.html#namingvars http://area51.phpbb.com/phpBB/docs/coding-guidelines.html#codelayout

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@suheb

screenshot1
@protech See, here's the screenshot. Clicking on username opens user's profile

phpBB/memberlist.php
@@ -992,7 +992,28 @@
);
break;
-
+
+ case 'livesearch':
+ $q=request_var('q', '', true);
+ $hint="";
+ $sql = "SELECT username, user_id
+ FROM " . USERS_TABLE . " u
+ WHERE username LIKE '".$q."%' AND u.user_type IN (" . USER_NORMAL . ', ' . USER_FOUNDER . ")";
@prototech Collaborator

Tabbing and quotations are incorrect - see http://area51.phpbb.com/phpBB/docs/coding-guidelines.html#sql. The user_type check should be done first and use $db->sql_in_set(). The LIKE statement contains a SQL injection. -you should be using $db->sql_like_expression(). Proper format:

    $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($q . $db->any_char);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
@@ -992,7 +992,28 @@
);
break;
-
+
+ case 'livesearch':
+ $q=request_var('q', '', true);
+ $hint="";
+ $sql = "SELECT username, user_id
+ FROM " . USERS_TABLE . " u
+ WHERE username LIKE '".$q."%' AND u.user_type IN (" . USER_NORMAL . ', ' . USER_FOUNDER . ")";
+ $result = $db->sql_query($sql);
+ $i=1;
+ while ($i<=10 && $row = $db->sql_fetchrow($result))
@prototech Collaborator

The limit should occur in the query itself, not afterwards. Use $db->sql_query_limit($sql, 10) instead of $db->sql_query($sql).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@prototech
Collaborator

The problem seems to occur because the onblur events fires before onclick, so the link no longer exists once the click registers.

phpBB/memberlist.php
@@ -1484,7 +1505,8 @@
'S_JOINED_TIME_OPTIONS' => $s_find_join_time,
'S_ACTIVE_TIME_OPTIONS' => $s_find_active_time,
'S_GROUP_SELECT' => $s_group_select,
- 'S_USER_SEARCH_ACTION' => append_sid("{$phpbb_root_path}memberlist.$phpEx", "mode=searchuser&amp;form=$form&amp;field=$field"))
+ 'S_USER_SEARCH_ACTION' => append_sid("{$phpbb_root_path}memberlist.$phpEx", "mode=searchuser&amp;form=$form&amp;field=$field"),
+ 'S_LIVE_SEARCH_ACTION' => append_sid("{$phpbb_root_path}memberlist.$phpEx", "mode=livesearch", $is_amp = false))
@prototech Collaborator

$is_amp = false is unnecessary.

@suheb
suheb added a note

@prototech No, this is for subsilver2 style, for which it returns "phpbb/memberlist.php?style=2&amp';'mode=livesearch" without $is_amp=false. And that wasn't working.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/styles/prosilver/template/memberlist_search.html
@@ -1,3 +1,24 @@
+<script>
+ function showHint(str) {
+ if (str.length<3) {

spaces?: str.length < 3
same below in subsilver

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
@@ -992,7 +992,30 @@
);
break;
-
+
+ case 'livesearch':
+ $username_chars = $request->variable('q', '', true);
+
+ $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);
@nickvergessen Collaborator

I would like to see this compared wiht lowercase. Sometimes you cant remember how SuPeRuSeR1234 capitalized his name.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
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>");
@nickvergessen Collaborator

can we add the table row to the template and then just clone the element.

@nickvergessen Collaborator

Also instead of bgJ and rowJ the table itself should be table.zebra-list

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@suheb

@nickvergessen what about subsilver2? I guess zebra-list does not work in it.

@gooof

What about a delay for the keyup function? Like: http://stackoverflow.com/questions/1909441/jquery-keyup-delay

phpBB/styles/prosilver/template/memberlist_search.html
@@ -9,7 +9,13 @@ <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" /></dd>
+ <dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox liveinput" autocomplete="off" />
+ <table class="table1 zebra-list" id="livesearch">
+ <tr id="user-search-row-tpl" style="display: none;">
+ <td><a class="user-search-link user-search-name" target='_blank'></a></td>
@gooof
gooof added a note

Don't mix ' and ".
Same for subsilver.
And the <a> has no href="#"

@nickvergessen Collaborator

also dont use target, let the user decide how to open the link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/assets/javascript/core.js
@@ -512,6 +512,40 @@ phpbb.timezonePreselectSelect = function(forceSelector) {
}
};
+// Listen live search box events
+$('.liveinput').keyup(function() {
@gooof
gooof added a note

Is here a better name possible e.g.: member-live-search

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/styles/prosilver/template/memberlist_search.html
@@ -9,7 +9,13 @@ <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" /></dd>
+ <dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox liveinput" autocomplete="off" />
+ <table class="table1 zebra-list" id="livesearch">
@gooof
gooof added a note

display:none for the table possible?

@suheb
suheb added a note

@gooof Well, the table is already empty as it only contains a hidden element. So, I not sure how useful would it be.

@gooof
gooof added a note

Ok, i hope this will work correctly in any browser. Could not find a fault with empty tables at the moment.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((5 lines not shown))
+
+ case 'livesearch':
+ $username_chars = $request->variable('q', '', true);
+ $username_chars = strtolower($username_chars);
+
+ $sql = 'SELECT username, user_id
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND LOWER(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;
@gooof
gooof added a note

no longer used, same for the two $i lines

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((9 lines not shown))
+
+ $sql = 'SELECT username, user_id
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND LOWER(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;
+ $user_list[] = array("id" => $row['user_id'], "name" => $row['username']);
+ $i++;
+ }
+
@gooof
gooof added a note

$db->sql_freeresult($result);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((12 lines not shown))
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND LOWER(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;
+ $user_list[] = array("id" => $row['user_id'], "name" => $row['username']);
+ $i++;
+ }
+
+ $json_response = new \phpbb\json_response();
+ echo $json_response->send($user_list);
+ exit();
@gooof
gooof added a note

never reached... not used

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((11 lines not shown))
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND LOWER(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;
+ $user_list[] = array("id" => $row['user_id'], "name" => $row['username']);
+ $i++;
+ }
+
+ $json_response = new \phpbb\json_response();
+ echo $json_response->send($user_list);
@gooof
gooof added a note

no: echo

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
@@ -992,7 +992,27 @@
);
break;
-
+
+ case 'livesearch':
+ $username_chars = $request->variable('q', '', true);
+ $username_chars = strtolower($username_chars);
+
+ $sql = 'SELECT username, user_id
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND LOWER(username) ' . $db->sql_like_expression($username_chars . $db->any_char);
@nickvergessen Collaborator

or even better, use:
AND username_clean ' . $db->sql_like_expression(utf8_clean_string($username_chars) . $db->any_char);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
@@ -992,7 +992,27 @@
);
break;
-
+
+ case 'livesearch':
+ $username_chars = $request->variable('q', '', true);
+ $username_chars = strtolower($username_chars);
@nickvergessen Collaborator

use utf8_strtolower()

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/memberlist.php
((4 lines not shown))
-
+
+ case 'livesearch':
+ $username_chars = $request->variable('q', '', true);
+ $username_chars = strtolower($username_chars);
+
+ $sql = 'SELECT username, user_id
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND LOWER(username) ' . $db->sql_like_expression($username_chars . $db->any_char);
+ $result = $db->sql_query_limit($sql, 10);
+
+ $user_list = array();
+ while ($row = $db->sql_fetchrow($result))
+ {
+ $user_list[] = array("id" => $row['user_id'], "name" => $row['username']);
@nickvergessen Collaborator

Single quote ' for id and name

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/styles/prosilver/template/memberlist_search.html
@@ -9,7 +9,13 @@ <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" /></dd>
+ <dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox live-search-input" autocomplete="off" />
+ <table class="table1 zebra-list" id="livesearch">
+ <tr id="user-search-row-tpl" style="display: none;">
+ <td><a class="user-search-link user-search-name" target="_blank"></a></td>
@nickvergessen Collaborator

No target, let the user decide, where to open it

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@nickvergessen nickvergessen commented on the diff
phpBB/styles/prosilver/template/memberlist_search.html
@@ -9,7 +9,13 @@ <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" /></dd>
+ <dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox live-search-input" autocomplete="off" />
+ <table class="table1 zebra-list" id="livesearch">
@nickvergessen Collaborator

Can we use the dropdown system here @prototech

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
phpBB/assets/javascript/core.js
@@ -512,6 +512,40 @@ phpbb.timezonePreselectSelect = function(forceSelector) {
}
};
+// Listen live search box events
+$('.live-search-input').keyup(function() {
+ var str = this.value;
+ if (str.length < 3) {
+ return;
+ }
+ var link, name;
+ var clone = $("#user-search-row-tpl").clone();
+ $("#livesearch").html("");
+ clone.appendTo("#livesearch");
@nickvergessen Collaborator

I'm not a fan of hardcoded ID usage here. This makes it possible to only use one suggestion per page.
Better add a ajax data attribute to the field

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@nickvergessen
Collaborator

:+1: for delayed keyup

@prototech
Collaborator

@suheb Please hold off on fixing the JS issues. :) I've made some changes locally to make the live search implementation more generic and usable in conjunction with phpbb.ajaxify. I'll send a PR against your branch tomorrow.

@nickvergessen nickvergessen referenced this pull request
Closed

Ticket/10737 #1634

@suheb

@prototech As you asked, I'm holding off on fixing JS issues while waiting for your PR.

@suheb

Sorry, I did some rebasing.. that's why all these commits.
@prototech You were gonna send a PR against my branch to make this feature more generic. What happened?

@nickvergessen
Collaborator

@prototech bump? :) Would like to see this in b2/b3

@nickvergessen
Collaborator

Replaced by #2267

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Feb 6, 2014
  1. @suheb
  2. @suheb

    [ticket/10737] Improvements over last commit

    suheb authored
    PHPBB3-10737
Commits on Feb 9, 2014
  1. @suheb
Commits on Feb 21, 2014
  1. @suheb
  2. @suheb
Commits on Feb 22, 2014
  1. @suheb

    [ticket/10737] Cloning table row instead of hard-coding it and using

    suheb authored
    case-insensitive search.
    
    PHPBB3-10737
Commits on Feb 23, 2014
  1. @suheb

    [ticket/10737] Removing obsolete code.

    suheb authored
    PHPBB3-10737
Commits on Feb 26, 2014
  1. @suheb
Commits on Feb 27, 2014
  1. @naderman

    Merge pull request #2062 from nickvergessen/ticket/12194

    naderman authored
    [ticket/12194] Ensure that field_show_novalue is present
Commits on Mar 9, 2014
  1. @suheb
  2. @suheb

    [ticket/10737] Improvements over last commit

    suheb authored
    PHPBB3-10737
  3. @suheb

    [ticket/10737] Code fixes in AJAX search feature

    suheb authored
    PHPBB3-10737
  4. @suheb
  5. @suheb

    [ticket/10737] Removing unnecessary/obsolete code.

    suheb authored
    PHPBB3-10737
  6. @suheb

    [ticket/10737] Cloning table row instead of hard-coding it and using

    suheb authored
    case-insensitive search.
    
    PHPBB3-10737
  7. @suheb

    [ticket/10737] Removing obsolete code.

    suheb authored
    PHPBB3-10737
  8. @suheb
Commits on Mar 10, 2014
  1. @suheb
  2. @suheb
This page is out of date. Refresh to see the latest.
View
45 phpBB/assets/javascript/core.js
@@ -512,6 +512,51 @@ phpbb.timezonePreselectSelect = function(forceSelector) {
}
};
+// Listen live search box events
+var delay = (function(){
+ var timer = 0;
+ return function(callback, ms){
+ clearTimeout (timer);
+ timer = setTimeout(callback, ms);
+ };
+})();
+
+$('.live-search-input').keyup(function() {
+ var str = this.value;
+ delay(function(){
+ if (str.length < 3) {
+ return;
+ }
+ var link, name;
+ var clone = $("#user-search-row-tpl").clone();
+ $("#livesearch").html("");
+ clone.appendTo("#livesearch");
+ $.ajax({
+ url:'memberlist.php?mode=livesearch&'+"&q="+str,
+ success:function(result) {
+ $.each(result, function(idx, elem) {
+ link = "memberlist.php?mode=viewprofile&u=" + elem.id;
+ name = elem.name;
+ clone = $("#user-search-row-tpl").clone();
+ clone.find(".user-search-link").attr("href", link);
+ clone.find(".user-search-name").html(name);
+ clone.attr("style", "");
+ clone.appendTo("#livesearch");
+ });
+ }
+ });
+ }, 2000 );
+});
+
+$(document).click(function(event) {
+ var target = $( event.target );
+ if(!target.is("#livesearch, #livesearch *, .live-search-input")) {
+ var clone = $("#user-search-row-tpl").clone();
+ $("#livesearch").html("");
+ clone.appendTo("#livesearch");
+ }
+});
+
// Toggle notification list
$('#notification_list_button').click(function(e) {
$('#notification_list').toggle();
View
24 phpBB/memberlist.php
@@ -30,7 +30,7 @@
$topic_id = request_var('t', 0);
// Check our mode...
-if (!in_array($mode, array('', 'group', 'viewprofile', 'email', 'contact', 'searchuser', 'leaders')))
+if (!in_array($mode, array('', 'group', 'viewprofile', 'email', 'contact', 'searchuser', 'leaders', 'livesearch')))
{
trigger_error('NO_MODE');
}
@@ -989,7 +989,27 @@
);
break;
-
+
+ case 'livesearch':
+ $username_chars = $request->variable('q', '', true);
+ $username_chars = utf8_strtolower($username_chars);
+
+ $sql = 'SELECT username, user_id
+ FROM ' . USERS_TABLE . '
+ WHERE ' . $db->sql_in_set('user_type', array(USER_NORMAL, USER_FOUNDER)) . '
+ AND username_clean ' . $db->sql_like_expression(utf8_clean_string($username_chars) . $db->any_char);
+ $result = $db->sql_query_limit($sql, 10);
+
+ $user_list = array();
+ while ($row = $db->sql_fetchrow($result))
+ {
+ $user_list[] = array('id' => $row['user_id'], 'name' => $row['username']);
+ }
+ $db->sql_freeresult($result);
+ $json_response = new \phpbb\json_response();
+ $json_response->send($user_list);
+ break;
+
case 'group':
default:
// The basic memberlist
View
8 phpBB/styles/prosilver/template/memberlist_search.html
@@ -9,7 +9,13 @@ <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" /></dd>
+ <dd><input type="text" name="username" id="username" value="{USERNAME}" class="inputbox live-search-input" autocomplete="off" />
+ <table class="table1 zebra-list" id="livesearch">
@nickvergessen Collaborator

Can we use the dropdown system here @prototech

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
+ <tr id="user-search-row-tpl" style="display: none;">
+ <td><a class="user-search-link user-search-name" ></a></td>
+ </tr>
+ </table>
+ </dd>
</dl>
<!-- IF S_EMAIL_SEARCH_ALLOWED -->
<dl>
View
11 phpBB/styles/prosilver/theme/common.css
@@ -896,6 +896,17 @@ li.pagination ul {
z-index: 51;
}
+/* Live search box */
+#livesearch {
+ width: 30%;
+ margin: 0px;
+ position: absolute;
+ background-color: #12A3EB;
+ box-shadow: 1px 2px 5px rgb(175,167,167);
+ z-index: 999;
+ overflow: auto;
+}
+
/* Miscellaneous styles
---------------------------------------- */
#forum-permissions {
View
9 phpBB/styles/subsilver2/template/memberlist_search.html
@@ -75,7 +75,14 @@
</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}" /></td>
+ <td class="row2">
+ <input class="post live-search-input" type="text" name="username" value="{USERNAME}" autocomplete="off" />
+ <table class="tablebg" id="livesearch">
+ <tr id="user-search-row-tpl" style="display: none;">
+ <td><a class="user-search-link user-search-name" ></a></td>
+ </tr>
+ </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>
View
9 phpBB/styles/subsilver2/theme/stylesheet.css
@@ -699,6 +699,15 @@ pre {
font-weight: bold;
}
+#livesearch {
+ width: 35%;
+ margin: 0px;
+ position: absolute;
+ box-shadow: 1px 2px 5px rgb(175,167,167);
+ border-spacing: 0px;
+ z-index: 999;
+ overflow: auto;
+}
/* Former imageset */
span.imageset {
Something went wrong with that request. Please try again.