+ Start a Discussion
Raju kanoperiRaju kanoperi 

Build a serach page in visualforce page

how to build a search like google serach in visualforce page. for example i am serching something like "salesforce materials" in visualforce page dirctly go to that page ..please help me ..



thanks
SandhyaSandhya (Salesforce Developers) 
Hi Raju kanoperi,

Please see below sample code.
<apex:page controller="Googlequery" id="pg">
    <script>
        function redirectToGoogle(){
           var a=document.getElementById('pg:frm:pg:input').value;
           window.parent.open('http://www.google.com/search?q='+a);
        }
    </script>
  
    <apex:form id="frm">
        <apex:pageBlock id="pg">
             <apex:outputLabel id="op">Query Google</apex:outputLabel>
             <apex:inputText value="{!qry}" id="input"/>
        </apex:pageBlock>
        <apex:commandButton value="Search keyword" onclick="redirectToGoogle();" id="cmd"/> 
    </apex:form>
</apex:page>
 
public class Googlequery{
  public string qry{get;set;}
  
  public pagereference searchpage(){
    Pagereference pg=new pagereference('http://www.google.com/search?q='+qry);
    pg.setRedirect(true);
    return pg;
  }
}

Also below are some of the useful links for search functionality.


http://blog.jeffdouglas.com/2010/07/13/building-a-dynamic-search-page-in-visualforce/

https://developer.salesforce.com/docs/atlas.en-us.knowledge_dev.meta/knowledge_dev/knowledge_customize_searchpage_visualforce.htm
 
http://gtr.net/how-to-build-a-simple-search-page-using-visualforce/
 
Hope this helps you!

Please accept my solution as Best Answer if my reply was helpful. It will make it available for other as the proper solution. If you felt I went above and beyond, you can give me kudos.
 
Thanks and Regards
Sandhya

 
SandhyaSandhya (Salesforce Developers) 
Hi,

Change your visual force page as below.
 
<apex:page controller="Googlequery" id="pg">
    <script>
        function redirectToGoogle(){
           var a=document.getElementById('pg:frm:pg:input').value;
           window.parent.open('http://www.google.com/search?q='+a);
        }
    </script>
  
    <apex:form id="frm">
        <apex:pageBlock id="pg">
             <apex:outputLabel id="op">Query Google</apex:outputLabel>
             <apex:inputText value="{!qry}" id="input"/>
        </apex:pageBlock>
        <apex:commandButton value="Search keyword" onclick="redirectToGoogle();" id="cmd"/> 
    </apex:form>
</apex:page>

Hope this helps you!

Thanks and Regards
Sandhya
Raju kanoperiRaju kanoperi
Hi, sandhya i don't want redirect into new window. see here  google information is related list of account. i can serach here something like        ''sfdc blogs''  i want display results here itself means bottom of the serach button.


User-added image 
Harish RamachandruniHarish Ramachandruni
Hi,

Please check bellow code .




 
<apex:page Controller="AccountSearch">
<apex:form >
 
<apex:outputPanel layout="block">
<label for="checkbox"> Limit to Account I own: </label>
    <apex:inputCheckbox value="{!IsOwnerSpecific}" />
</apex:outputPanel>
<!--<apex:commandButton action="{!search}" value="Search"/>-->
 
<apex:pageBlock mode="edit" id="block">
         <apex:pageBlockSection >
            <apex:pageBlockSectionItem >
               <apex:outputLabel for="searchText">Search Text</apex:outputLabel>
               <apex:panelGroup >
                  <apex:inputText id="searchText" value="{!searchText}"/>
                  <apex:commandButton value="Submit" action="{!search}" 
                                      rerender="block"/>
               </apex:panelGroup>
            </apex:pageBlockSectionItem>
        </apex:pageBlockSection>
 <apex:actionStatus id="status" startText="requesting..."/>
<apex:pageBlockSection title="Results" id="results" columns="1">
           <apex:pageBlockTable value="{!results}" var="a"
                               rendered="{!NOT(ISNULL(results))}">
                               
              <apex:column value="{!a.Name}"/>
              <apex:column value="{!a.Industry}"/>
              <apex:column value="{!a.Rating}"/>
              <!--<apex:column value="{!a.Account_Region__c}"/>
              <apex:column value="{!a.Account_Priority__c}"/>
              <apex:column value="{!a.Account_Summary__c}"/>-->
   </apex:pageBlockTable>
   </apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</apex:page>


 
public class AccountSearch {
 
  String searchText;
   List<Account> results;
    public Boolean IsOwnerSpecific {get;set;} 
public String getSearchText() {
      return searchText;
   }
 
   public void setSearchText(String s) {
      searchText = s;
   }
 
   public List<Account> getResults() {
      return results;
   }
    public PageReference search() {
        if(IsOwnerSpecific){
            results = (List<Account>)[FIND :searchText RETURNING Account(Name, Industry, Rating /*,Account_Region__c, Account_Priority__c, Account_Summary__c*/ where ownerId=:UserInfo.getUserId()) ][0];
        }else{
            results = (List<Account>)[FIND :searchText RETURNING Account(Name, Industry, Rating /*,Account_Region__c, Account_Priority__c, Account_Summary__c*/)][0];
        }
         
        return null;
    }
 
}

Regards,
Harish.R
 
Prashant Pandey07Prashant Pandey07
Searching functionality is quite easy even the salesforce provide the gobal search option(Out of the box)...but let me know if you have any specifc requiremnts..Here is the basic search functionaliy to search a contact 

public with sharing class searchcontroller { 
public list <contact> con {get;set;} 
public string searchstring {get;set;} 
public searchcontroller( ) { 

public void searchContact(){ 
string searchquery='select name,id from contact where name like \'%'+searchstring+'%\' Limit 20';   // querying form contact  to retrive the user input keywork
con= Database.query(searchquery); 

public void clear(){ 
con.clear(); 

}


Take a look at the code for the Visualforce page to check the output:


<apex:page Controller="searchcontroller" > 
<apex:form > 
<apex:inputText value="{!searchstring}" label="Input"/> 
<apex:commandButton value="Search Contact" action="{!searchcontact}"/> 
<apex:commandButton value="Clear records" action="{!clear}"/> 
<apex:pageBlock title="Contact Search Result"> 
<apex:pageblockTable value="{!con}" var="a"> 
<apex:column value="{!a.name}"/> 
<apex:column value="{!a.id}"/> 
</apex:pageBlockTable> 
</apex:pageBlock> 
</apex:form> 
</apex:page>