how to get the text from a autosuggestion box to the search box?

how to get the text from a autosuggestion box to the search box?

i have created a search box and added autosuggestion functionality using jquery and on click of the autosuggestion content it is redirecting to the respective link. But I need that on click of the autosuggestion content the text should go to the search box and on click of the search button it should redirect to the respective link as in google search box.If any suggestion please help....
 
I am pasting my code here.Can anybody go throug it and tell me the modifications as per my requirement. 
 
  1. <script src="/_layouts/SocialEdge/jquery.min.js" type="text/javascript"></script><script src="/_layouts/SocialEdge/jquery.js" type="text/javascript"></script><script type="text/javascript"> // QuickSearch v0.1 // Created by Jan Tielens, http://weblogs.asp.net/jan // This sample code is provided on an “as is” basis and without warranty of any kind. // *** Customizable parameters *** var quickSearchConfig = { delay: 500, // time to wait before executing the query (in ms) minCharacters: 3, // minimum nr of characters to enter before search scope:"All", // search scope to use numberOfResults: 15, // number of results to show resultsAnimation: 200, // animation time (in ms) of the search results resultAnimation: 0 // animation time (in ms) of individual result (when selected) }; </script><style type="text/css"> .quickSearchResultDivUnselected { BORDER-BOTTOM: white 1px solid; BORDER-LEFT: white 1px solid; TEXT-OVERFLOW: ellipsis; BACKGROUND: white; MARGIN-LEFT: 2px; OVERFLOW: hidden; BORDER-TOP: white 1px solid; BORDER-RIGHT: white 1px solid } .quickSearchResultDivSelected { BORDER-BOTTOM: gray 1px solid; BORDER-LEFT: gray 1px solid; TEXT-OVERFLOW: ellipsis; BACKGROUND: #eeeeee; MARGIN-LEFT: 2px; OVERFLOW: hidden; BORDER-TOP: gray 1px solid; BORDER-RIGHT: gray 1px solid }</style><table class="ms-sbtable ms-sbtable-ex" id="quickSearchTable" border="0"><tbody><tr class="ms-sbrow"><td><select id="ddlScope" style="padding-bottom: 8px !important; padding-left: 8px !important; padding-right: 8px !important; font-size: 9pt !important; padding-top: 8px !important"> <option>All Sites</option> <option>People</option> <option>Content</option> <option>Groups</option></select> </td> <td class="ms-sbcell"><input title="Enter search words" class="ms-sbplain" id="quickSearchTextBox" maxlength="200" alt="Enter search words" jquery1346393047864="2" jquery1346391473507="2" jquery1346391219718="2" jquery1346390974165="2" jquery1346390860706="2" jquery1346390832005="2" jquery1346390744926="2" jquery1346390690170="2" jquery1346390625143="2" jquery1346390592804="2" jquery1346390500794="2" jquery1346390402497="2" jquery1346389674420="2" jquery1346389561030="2" jquery1346389477899="2" jquery1346389367249="2" jquery1346388845956="2" jquery1346388678953="2" jquery1346386915455="2" jquery1346333070011="2" jquery1346331504004="2" jquery1346331397305="2" jquery1346331370996="2" jquery1346331319572="2" jquery1346331234717="2" jquery1346330674989="2" jquery1346330470686="2" jquery1346326298805="2" jquery1346326266636="2" jquery1346326137443="2" jquery1346386066956="2" jquery1346488410040="2" jquery1346488435698="2" jquery1346489061234="2" jquery1346489136795="2" jquery1346489157202="2" jquery1346489290706="2" style="width: 100%"/> </td> <td class="ms-sbgo ms-sbcell" style="width: 14px"><img title="Go Search" alt="Go Search" src="/_layouts/images/gosearch.gif" style="border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px"/> </td> <td style="width: 1px"></td></tr></tbody></table> <div id="quickSearchResults" style="display: none"></div> <script type="text/javascript"> var quickSearchTimer; var quickSearchSelectedDivIndex = -1; function showResultsDiv(text) { var div = $("#quickSearchResults"); var prevTable = div.prev(); var divCss = { "left": 20, "padding": 2, "position": "absolute", "top": 74, "border": "1px solid #7f9db9", "width": prevTable.width() - 3, "background": "white", "max-width": prevTable.width() - 3 }; div.css(divCss).append(text).slideDown(quickSearchConfig.resultsAnimation); } $(document).ready(function() { $('#quickSearchTextBox').keyup(function(event) { var previousSelected = quickSearchSelectedDivIndex; // catch some keys switch(event.keyCode) { case 13: // enter var selectedDiv = $("#quickSearchResults>div:eq(" + quickSearchSelectedDivIndex + ") a"); if(selectedDiv.length == 1) window.location = selectedDiv.attr("href"); break; case 38: // key up quickSearchSelectedDivIndex--; break; case 40: // key down quickSearchSelectedDivIndex ++; break; } // check bounds if(quickSearchSelectedDivIndex != previousSelected) { if(quickSearchSelectedDivIndex < 0) quickSearchSelectedDivIndex = 0; if(quickSearchSelectedDivIndex >= $("#quickSearchResults>div").length -1) quickSearchSelectedDivIndex = $("#quickSearchResults>div").length - 2; } // select new div, unselect the previous selected if(quickSearchSelectedDivIndex > -1) { if(quickSearchSelectedDivIndex != previousSelected) { unSelectDiv( $("#quickSearchResults>div:eq(" + previousSelected + ")")); selectDiv($("#quickSearchResults>div:eq(" + quickSearchSelectedDivIndex + ")")); } } // if the query is different from the previous one, search again if($('#quickSearchTextBox').data("query") != $('#quickSearchTextBox').val()) { if (quickSearchTimer != null) // cancel the delayed event clearTimeout(quickSearchTimer); quickSearchTimer = setTimeout(function() { // delay the searching $("#quickSearchResults").fadeOut(200, initSearch); } , quickSearchConfig.delay); } }); }); function unSelectDiv(div) { // first stop all animations still in progress $("#quickSearchResults>div>div").stop(true,true); div.removeClass("quickSearchResultDivSelected").addClass("quickSearchResultDivUnselected"); $("#details", div).hide(); } function selectDiv(div) { div.addClass("quickSearchResultDivSelected"); $("#details", div).slideDown(quickSearchConfig.resultAnimation); } function initSearch() { // first store query in data $('#quickSearchTextBox').data("query", $('#quickSearchTextBox').val()); // clear the results $("#quickSearchResults").empty(); // start the search var query = $("#quickSearchTextBox").val(); if(query.length >= quickSearchConfig.minCharacters) { showResultsDiv("Searching ..."); // display status search(query); } } function search(query) { //alert ($('#ddlScope').val()); var MyScope=$('#ddlScope').val(); //alert (MyScope); quickSearchSelectedDivIndex = -1; //alert(quickSearchConfig.scope); //alert(vScope); var queryXML = "<QueryPacket xmlns='urn:Microsoft.Search.Query' Revision='1000'> \ <Query domain='QDomain'> \ <SupportedFormats><Format>urn:Microsoft.Search.Response.Document.Document</Format></SupportedFormats> \ <Context> \ <QueryText language='en-US' type='STRING' >SCOPE:\"" + MyScope + "\"" + query + "</QueryText> \ </Context> \ <SortByProperties><SortByProperty name='Rank' direction='Descending' order='1'/></SortByProperties> \ <Range><StartAt>1</StartAt><Count>" + quickSearchConfig.numberOfResults + "</Count></Range> \ <EnableStemming>false</EnableStemming> \ <TrimDuplicates>true</TrimDuplicates> \ <IgnoreAllNoiseQuery>true</IgnoreAllNoiseQuery> \ <ImplicitAndBehavior>true</ImplicitAndBehavior> \ <IncludeRelevanceResults>true</IncludeRelevanceResults> \ <IncludeSpecialTermResults>true</IncludeSpecialTermResults> \ <IncludeHighConfidenceResults>true</IncludeHighConfidenceResults> \ </Query></QueryPacket>"; var soapEnv = "<soap:Envelope xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' xmlns:xsd='http://www.w3.org/2001/XMLSchema' xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/'> \ <soap:Body> \ <Query xmlns='urn:Microsoft.Search'> \ <queryXml>" + escapeHTML(queryXML) + "</queryXml> \ </Query> \ </soap:Body> \ </soap:Envelope>"; $.ajax({ url: "/_vti_bin/search.asmx", type: "POST", dataType: "xml", data: soapEnv, complete: processResult, contentType: "text/xml; charset=\"utf-8\"" }); function processResult(xData, status) { var html = ""; $(xData.responseXML).find("QueryResult").each(function() { var divWidh = $("#quickSearchTable").width() - 13; var x = $("<xml>" + $(this).text() + "</xml>"); x.find("Document").each(function() { var title = $("Title", $(this)).text(); var url = $("Action>LinkUrl", $(this)).text(); var description = $("Description", $(this)).text() html += "<div class='quickSearchResultDivUnselected' style='width:" + divWidh + "px;max-width:" + divWidh +"px'> \ <a href='" + url + "'>" + $("Title", $(this)).text() + "</a> \ <div style='display:none' id='details' style='margin-left:10px'>" + description + "<br/>" + url + " \ </div> \ </div>"; }); if(x.find("TotalAvailable").text() != "") html += "<div style='text-align:right'>Total results: " + x.find("TotalAvailable").text() + "</div>"; else html += "<div style='text-align:right'>Total results: 0</div>"; }); $("#quickSearchResults").empty().append(html); $("#quickSearchResults>div>a").hover( function() { selectDiv($(this).parent()); }, function() { unSelectDiv($(this).parent()); } ); showResultsDiv(); } } function escapeHTML (str) { return str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'); }</script>
  2. Thanks
    Sucharita30