Jeff,
Thanks a ton!
Managed to do it!
Have a great weekend!
Just sharing the code here in case anyone else needs the same solution.
( Jquery Google Ajax Search Api )
===================================================================
var added=false;
function search(){
var gcscPostSearch = {};
gcscPostSearch.uiAddOn = function() {
if(!added)
{
$("#results").prepend("<div class='clearsearch'>Clear Search / Close</
div>");
added=true;
}
$("#results .gsc-results").css('font-family','Arial,Helvetica,sans-
serif')
.css('border-left','1px solid #D4E0F2')
.css('border-top','1px solid #D4E0F2')
.css('border-right','1px solid #D4E0F2')
.css('border-bottom','1px solid #D4E0F2')
.css('padding','10px 0 10px 10px');
$("#results .clearsearch").css('border-left','1px solid #D4E0F2')
.css('border-top','1px solid #20387D')
.css('border-right','1px solid #20387D')
.css('border-left','1px solid #20387D')
.css('border-bottom','1px solid #20387D')
.css('background','#D4E0F2')
.css('padding','5px 5px 5px 5px')
.css('cursor','pointer')
.css('float','right');
$("#results .clearsearch").click(function(){triggerGoogleSearch();})
};
var d=new google.search.DrawOptions();
var c=new google.search.CustomSearchControl("xxx");
c.setLinkTarget(google.search.Search.LINK_TARGET_SELF);
c.setNoResultsString("Sorry! We could not find what you are looking
for.");
c.setSearchCompleteCallback(gcscPostSearch, gcscPostSearch.uiAddOn);
d.setInput(document.getElementById("query_input"));
c.draw(document.getElementById("results"),d);
}
$.getScript("http://www.google.com/jsapi",function(){google.load
("search","1",{callback:search});});
===============================================================================
in the above code, triggerGoogleSearch() is a method written
specifically, to reset google search.
Cheers,
Jim.
On Oct 31, 8:59 am, Jim <[email protected]> wrote:
> Hi Jeff,
>
> Thank you for taking the time to reply.
>
> To put it quite simply, your solution blew right over my head :).
>
> I have written a small jquery code, to implement the search more
> efficiently.
> function search(){
> var d=new google.search.DrawOptions();
> var c=new google.search.CustomSearchControl("xxx");
> c.setLinkTarget(google.search.Search.LINK_TARGET_SELF);
> c.setNoResultsString("Sorry! We could not find what you are looking
> for.");
> d.setInput(document.getElementById("query_input"));
> c.draw(document.getElementById("results"),d);
> }
> $.getScript("http://www.google.com/jsapi",function(){google.load
> ("search","1",{callback:search});});
>
> I don't know how to hook, or send the control back, once a search is
> initiated. This code loads
> once the page is loaded, and then the search field is then ready for
> input.
> There is no button(so cannot send control back to the script using the
> button).
>
> The only way, in my limited knowledge on the api, is to write/draw a
> close button alongside the results.
> In the tabs area.
>
> However you have given me a good hint about the class that draws it,
> will rack my brain some more and try,
> Please do let me know if there is a easier way.
>
> Thank you,
> Jim.
>
> On Oct 28, 1:58 am, "Jeff S (Google)" <[email protected]> wrote:
>
>
>
> > Hi Jim,
>
> > I recently worked on a sample where we used
> > control.setSearchCompleteCallback to add a small x to clear the results by
> > adding new nodes to the DOM after the searches are completed. You can see
> > the code here
>
> >http://en.wikipedia.org/w/index.php?title=User:Jscud/vector.js&action...
>
> > (We talked about it in greater detail in this blog
> > post:http://googlecustomsearch.blogspot.com/2009/10/contextual-search-expe...)
>
> > There is more than one way to do this, but would the above example work for
> > what you are trying to do?
>
> > Thank you,
>
> > Jeff
>
> > On Thu, Oct 22, 2009 at 8:48 PM, Jim <[email protected]> wrote:
>
> > > Hi,
>
> > > Recently, I added google custom search to my site.
> > > However it does not show a clear button in the results.
> > > Was wondering if there is a draw option for this.
>
> > > If you go to this blog
> > >http://googlecustomsearch.blogspot.com/
> > > The search for the blog itself has a clear button(a small "x") in the
> > > results.
> > > However the developer has used google search widget. Not custom
> > > search.
> > > I would like a similar "clear button 'x'" to be drawn in my results.
> > > Could not find a draw option for this.
>
> > > The link below has the same features as my search(It is not my site):
> > >http://ajax-apis.appspot.com/cse-less-style
>
> > > function triggerGoogleSearch()
> > > My code:
> > > {
> > > google.load('search', '1');
> > > //Google Branding
> > > google.search.Search.getBranding(document.getElementById("branding"));
> > > // Create a Custom Search control that uses a CSE restricted to
> > > code.google.com
> > > // Change the customSearchId string to the ID of your own Custom
> > > Search engine.
> > > var customSearchControl = new google.search.CustomSearchControl
> > > ('xxxx');
> > > //open search links clicked in same window
> > > customSearchControl.setLinkTarget
> > > (google.search.Search.LINK_TARGET_SELF);
> > > //Set drawing options to use my text box as input instead of having
> > > the library create one.
> > > var drawOptions = new google.search.DrawOptions();
> > > drawOptions.setInput(document.getElementById('query_input'));
> > > //Draw the control in content div
> > > customSearchControl.draw('results', drawOptions);
> > > google.setOnLoadCallback(onLoad);
> > > }
>
> > > Thanks, Its probably something small, but has been bugging me for a
> > > while, don't want to upload the search feature to my site without it
> > > having
> > > the clear search button.
>
> > > Appreciate any help!
>
> > > Regards,
> > > Jim.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Google AJAX APIs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/google-ajax-search-api?hl=en
-~----------~----~----~----~------~----~------~--~---
