The Arcive of Official vBulletin Modifications Site.

Live Search 1.0 (AJAX) · **Released**: 08-07-2007

About the hack
==============
The hack adds a quick live search form to your forum's at any place you want it,
results are to be shown exactly under the search field as you type (by ajax)

Supported browsers
==============
IE6, IE7, FF2, Opera 9

Demo
====================
http://www.montadaphp.net
right under the logo

How to Install
==============
1- Add the following code to the end of ur "headinclude" template:

Code:

<script type="text/javascript">
/***********************************************
* Drop Down/ Overlapping Content- ? Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
function getposOffset(overlay, offsettype){
var totaloffset=(offsettype=="left")? overlay.offsetLeft : overlay.offsetTop;
var parentEl=overlay.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function overlay(curobj, subobjstr, opt_position){
if (document.getElementById){
var subobj=document.getElementById(subobjstr)
subobj.style.display="block"
var xpos=getposOffset(curobj, "left")+((typeof opt_position!="undefined" && opt_position.indexOf("right")!=-1)? -(subobj.offsetWidth-curobj.offsetWidth) : 0) 
var ypos=getposOffset(curobj, "top")+((typeof opt_position!="undefined" && opt_position.indexOf("bottom")!=-1)? curobj.offsetHeight : 0)
subobj.style.left=xpos+"px"
subobj.style.top=ypos+"px"
return false
}
else
return true
}

function overlayclose(subobj){
document.getElementById(subobj).style.display="none"
}
var xmlHttp3 
function showHint(word) 
{ 
document.getElementById('search_results').innerHTML = '<p></p><p></p><p align="center" class="smallfont"><img src="images/progress.gif" />Searching..</p>';
    xmlHttp3=GetXmlHttpObject3() 
    if (xmlHttp3==null) 
    { 
        alert ("Browser does not support HTTP Request") 
        return 
    } 
    var url="ajax_search.php" 
    url=url+"?query="+word 
    xmlHttp3.onreadystatechange=stateChanged3 
    xmlHttp3.open("GET",url,true) 
    xmlHttp3.send(null) 
} 

function stateChanged3() 
{ 
    if (xmlHttp3.readyState==4 || xmlHttp3.readyState=="complete") 
    { 
        document.getElementById("search_results"). innerHTML='<div align="left"><a href="#" onClick="overlayclose(\'search_results\'); return false">x</a></div>'+xmlHttp3.responseText; 
return overlay(this, 'search_results')
    } 
} 

function GetXmlHttpObject3() 
{ 
    var objXMLHttp3=null 
    if (window.XMLHttpRequest) 
    { 
        objXMLHttp3=new XMLHttpRequest() 
    } 
    else if (window.ActiveXObject) 
    { 
        objXMLHttp3=new ActiveXObject("Microsoft.XMLHTTP") 
    } 
    return objXMLHttp3 
}
</script>

2- Add the following code wherever you want the search field to appear, for me i added to the "header" template exactly under the logo:

Code:

<form action="search.php?do=process" method="post">
<input type="hidden" name="do" value="process" />
<input type="hidden" name="quicksearch" value="1" />
<input type="hidden" name="childforums" value="1" />
<input type="hidden" name="exactname" value="1" />
<input type="hidden" name="s" value="$session[sessionhash]" />
Live search <input type="text" name="query" size="25" class="header_search_field" onkeyup="showHint(this.value)" />
</form>
<div id="search_results" class="smallfont" style="position:absolute; border: 2px solid orange; color:blue; background-color: white; width: 300px; padding: 8px; display:none;overflow:auto; height:200px">
<div align="left"><a href="#" onClick="overlayclose('search_results'); return false">x</a></div>
</div>

3- Upload the contents of folder "Upload" to ur froum's home directory.

and u r done

If u like the hack please dont forget to click INSTALL

Brew · #52 08-09-2007, 02:18 PM

Quote:

Originally Posted by Regs

Yes, I read that. But my question remains - is this one query on every keystroke?

Seeing as how the script grabs info from the server in order to insert the links I would say it's safe to assume that each keystroke causes one query.

coderphp · #53 08-09-2007, 04:12 PM

Quote:

Originally Posted by valdet

When i type in the search field, this error pops out in search results table..

Any ideas.. as I would install this on my live site in a snap...

Thanks.

it seems u have a problem in the file "ajax_search.php"
Please try to upload the file again... and tell me if the problem presists

Quote:

Originally Posted by Magnumutz

This is awesome... Thanks.
*Installed*

thanx

Quote:

Originally Posted by Regs

Someone asked earlier about queries... does this not query the server on every key press?

It's a very good idea but not too sure it is friendly for a large, busy site?

Cheers,

~Regs.

Yes ti do one query every keypress
again i tested on medium forum (mine) and it didnt show any problems till now
i didnt test on large forums
if it appear to be a problem on large forums we could add a time limit then

but i dont like to do so now cause it no longer be LIVE SEARCH

Quote:

Originally Posted by Regs

Yes, I read that. But my question remains - is this one query on every keystroke?

yes as mentioned on every key stroke

Quote:

Originally Posted by Brew

In FireFox the mod looks great but it's a bit different in IE. The box comes up too small in IE.

EDIT:
I forgot to mention that the below pics were taken after adding the code for the div statement from another reply; overflow:auto; height:200px but the layout is the same with or without the change.

Examples below..The first image is FF the second is IE..

what versions do u use of browsers? i tested it on the browsers mentioned in the first post and it is working good

coderphp · #54 08-09-2007, 04:14 PM

Quote:

Originally Posted by StrifeX

Wow, thanks for the solution to my problem

Btw coderphp, i downloaded the new version of your mod and i had the same problem, you might want to add rainyleaves' code into your php file... And you might also want to update the version of your hack to like 1.01

.

Also, how do i get the text to show "Searching..." instead of "???? ???????.." while searching?

table prefix already added
also template edit updated.. please install the updated ones

coderphp · #55 08-09-2007, 04:17 PM

Quote:

Originally Posted by Brew

In FireFox the mod looks great but it's a bit different in IE. The box comes up too small in IE.

EDIT:
I forgot to mention that the below pics were taken after adding the code for the div statement from another reply; overflow:auto; height:200px but the layout is the same with or without the change.

Examples below..The first image is FF the second is IE..

i think that is because u combine the mod to the DHTML search menu
infact i didnt test it in the DHTML menu but only in the header portion of the page, outside the DHTML menu

Brew · #56 08-09-2007, 04:51 PM

Quote:

Originally Posted by coderphp

i think that is because u combine the mod to the DHTML search menu
infact i didnt test it in the DHTML menu but only in the header portion of the page, outside the DHTML menu

I really don't know much about DHTML and AJAX.

I wonder if there is something to add to either the DHTML or this mod to make it work correctly in IE within the stock search dropdown.

BTW, My Internet Explorer version is 7.0.5730.11

Quantnet · #57 08-09-2007, 05:06 PM

Very nice mod. Installed.

In my search, there is a radio button to select Post or Thread, can you modify the code so it can search post as supposed to search Thread by default now.

You can look at the site on my signature to see my search box

Quantnet · #58 08-09-2007, 05:17 PM

not sure if this is a bug

On FF, the search result displayed on the ajax box is left aligned while in Opera 9.22, it's right aligned

Also, i have a wiki on my site at www.quantnet.org/wiki but the search box is no longer working there. The default select radio button is disappear on the wiki site. Thread is selected by default on the forum site but as soon as i go to my wiki site, the select disappear so i can't search anymore

Quantnet · #59 08-09-2007, 05:30 PM

Here is the code of the search box that i have in my navbar template

Code:

<!-- search -->
		<if condition="$show['searchbuttons']">
	 <td align="right" nowrap="nowrap" valign="top">
		<if condition="$show['member']">
			<form action="search.php?do=process" method="post">
	<else />
			<form action="search.php$session[sessionurl_q]" method="post">
	</if>
	<table cellpadding="0" cellspacing="0" border="0">
			<tr>
				<td style="font-size:10px" title="nohilite">




					<input type="hidden" name="do" value="process" />
					<input type="hidden" name="quicksearch" value="1" />
					<input type="hidden" name="childforums" value="1" />
					<input type="hidden" name="exactname" value="1" />
					<input type="hidden" name="s" value="$session[sessionhash]" />


Live search <input type="text" name="query" size="25" class="header_search_field" onkeyup="showHint(this.value)" />
</form>
<div id="search_results" class="smallfont" style="position:absolute; border: 2px solid orange; color:blue; background-color: white; width: 300px; padding: 8px; display:none;overflow:auto; height:200px">
<div align="left"><a href="#" onClick="overlayclose('search_results'); return false">x</a></div>
</div>

					
				</td>
	<td nowrap="nowrap" id="navbar_search" class="smallfont">&nbsp;<a href="search.php$session[sessionurl_q]">Options</a> <script type="text/javascript"> vbmenu_register("navbar_search"); </script></td>
			</tr>
			<tr>
				<td colspan="2" style="font-size:10px" title="nohilite" nowrap="nowrap">
				Show:	<label for="rb_nb_sp0"><input type="radio" name="showposts" value="0" id="rb_nb_sp0" tabindex="1002" checked="checked" />threads</label>
					
					<label for="rb_nb_sp1"><input type="radio" name="showposts" value="1" id="rb_nb_sp1" tabindex="1003" />posts</label>
				</td>
			</tr>
			</table>
			</form>
	<!-- / search -->

Quantnet · #60 08-09-2007, 05:34 PM

Found another error:

I have this error when i search while I'm on the home page (i have vbAdvanced as homepage)

http://www.mysite.com/ 68.198.xxx.xxx /ajax_search.php?query=ds www.mysite.com Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6 404 Please contact admin@xxx.org if you can not find the content you are looking for.

coderphp · #61 08-09-2007, 05:43 PM

Quote:

Originally Posted by Brew

I really don't know much about DHTML and AJAX.

I wonder if there is something to add to either the DHTML or this mod to make it work correctly in IE within the stock search dropdown.

BTW, My Internet Explorer version is 7.0.5730.11

again the problem is the width of DHTML drop down menu is fixed
so u should better install this mod directly in the header portion of the page
or any place outside the drop down menu

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.09585 seconds Memory Usage 2,336KB Queries Executed 25 (?)
More Information
Template Usage: (1)SHOWTHREAD (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (1)ad_showthread_beforeqr (3)bbcode_code (10)bbcode_quote (1)footer (1)forumjump (1)forumrules (1)gobutton (1)header (1)headinclude (1)modsystem_post (1)navbar (6)navbar_link (120)option (1)pagenav (1)pagenav_curpage (4)pagenav_pagelink (11)post_thanks_box (11)post_thanks_button (1)post_thanks_javascript (1)post_thanks_navbar_search (11)post_thanks_postbit_info (10)postbit (11)postbit_onlinestatus (11)postbit_wrapper (1)spacer_close (1)spacer_open (1)tagbit_wrapper Phrase Groups Available: global inlinemod postbit posting reputationlevel showthread	Included Files: ./showthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/functions_bigthree.php ./includes/class_postbit.php ./includes/class_bbcode.php ./includes/functions_reputation.php ./includes/functions_post_thanks.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete showthread_start showthread_getinfo forumjump showthread_post_start showthread_query_postids showthread_query bbcode_fetch_tags bbcode_create showthread_postbit_create postbit_factory postbit_display_start post_thanks_function_post_thanks_off_start post_thanks_function_post_thanks_off_end post_thanks_function_fetch_thanks_start post_thanks_function_fetch_thanks_end post_thanks_function_thanked_already_start post_thanks_function_thanked_already_end fetch_musername postbit_imicons bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete postbit_display_complete post_thanks_function_can_thank_this_post_start pagenav_page pagenav_complete tag_fetchbit_complete forumrules navbits navbits_complete showthread_complete
Messages:

The Arcive of Official vBulletin Modifications Site.

It is not a VB3 engine, just a parsed copy!