Add-On Releases - Live Search 1.0 (AJAX)

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:

<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:

<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

[ArabSQuad]

Awesome
Thanks alot bro

[coderphp]

Originally Posted by Quantnet.org

I just check for different browser platform and here is where everything is different. I tested with IE7, Opera and FF.

For IE7 (The Live Search word is on top of the search box instead of on the left of it and the popup stay on the right)


For Opera (looks fine but the search result is right aligned


For FF (this looks perfect)



I include here the search code which I insert into navbar template (I have a highly customized style). I would really appreciate if you can see what's wrong

<!-- search -->
        <if condition="$show['searchbuttons']">
     <td align="right" nowrap="nowrap" valign="top">
        <if condition="$show['member']">
            <form action="/forum/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>
            
            </table>
            </form>
    <!-- / search -->

i checked the code twice.. i didnt find anything wrong with it.. sorry i wish i could help further

[coderphp]

Originally Posted by ArabSQuad

Awesome
Thanks alot bro

thanx ArabSQuad

[hoangminh]

If your database uses prefix, then this script will cause DB Error

To fix, at line 23

PHP Code:

$results = $db->query_read("SELECT * FROM ". TABLE_PREFIX ."thread WHERE `title` LIKE '%$query%' AND `thread`.`forumid` NOT IN (0 $excludelist)"); 


Change to:

PHP Code:

    $results = $db->query_read("SELECT * FROM ". TABLE_PREFIX ."thread WHERE `title` LIKE '%$query%' AND `". TABLE_PREFIX ."thread`.`forumid` NOT IN (0 $excludelist)"); 


[StrifeX]

I've done some custom work to the modification, and it's really looking awesome.

Great job buddy, I'm glad you came around with something like this.

[coderphp]

Originally Posted by hoangminh

If your database uses prefix, then this script will cause DB Error

To fix, at line 23


Change to:

PHP Code:

    $results = $db->query_read("SELECT * FROM ". TABLE_PREFIX ."thread WHERE `title` LIKE '%$query%' AND `". TABLE_PREFIX ."thread`.`forumid` NOT IN (0 $excludelist)"); 


Originally Posted by StrifeX

I've done some custom work to the modification, and it's really looking awesome.

Great job buddy, I'm glad you came around with something like this.

THANX

[SBlueman]

I love this mod! Thank you!

[69lakalle]

i tried to install but wont work ......i click install so ....for the next release . i have and email for the update

[nesta2006]

hello .
my problem lock page!!
please see : http://i21.tinypic.com/30t45xh.jpg
3 windows open inside! and lock scrol

please help me

[coderphp]

Originally Posted by nesta2006

hello .
my problem lock page!!
please see : http://i21.tinypic.com/30t45xh.jpg
3 windows open inside! and lock scrol

please help me

I think you did something wrong..
please re-install the mod