+ Start a Discussion
foodrunnerfoodrunner 

Need Help completing custom search functionality

I am working on a visualforce page that provides a search field and returns the results on the same page. I have two problems with the search field.

 

1. The search box can only be used once for each time the page loads. How do I change this to allow the user keep using the same page without manually refreshing the entire page? I have not found any discussions on this, so I don't have code to post that is not working.

 

2.  The second question I have does have some code that I have started. I am trying to program the search field allow the user hit enter on the keyboard to search rather than having to click the search button. Here is my Javascript:

 

button:

                <apex:commandButton value="Search" action="{!Search}" rerender="table"/>

 

javascript&colon;

<script> 
    function noenter(ev)  {
        if (window.event && window.event.keyCode == 13 || ev.which == 13) {
            Search();
            return false;
         } else {
              return true;
         }
     }

</script>

 

 

What do I need to change for this to work?

 

Thanks

bob_buzzardbob_buzzard

The good news is that this definitely can work, as I've used this for a number of clients.

 

Why can the search box only be used once?  As you are re-rendereding via your command button, presumably the user can fill in different information and click it again?  Or is there something here I'm missing.

 

The javascript looks reasonable, however we need to see what Search() does and also how its liked in to the input field.


Can you post the whole page?

foodrunnerfoodrunner

There is no reason why the user shouldn't be allowed to run more than one search, and I would like to allow that. Here is the visualforce page code:

 

<apex:page standardcontroller="Customer_Product_Line_Item__c" extensions="VisualforcewrapperClassController" > 
<!-- Javascript function to check all rows in the table --> 
<script> 
    function noenter(ev)  {
        if (window.event && window.event.keyCode == 13 || ev.which == 13) {
            Search();
            return false;
         } else {
              return true;
         }
     }


function checkAll(cb) 
{ 
var inputElem = document.getElementsByTagName("input"); 
for(var i=0;i<inputElem.length;i++) 
{ 
if(inputElem[i].id.indexOf("selectLine1")!=-1) 
inputElem[i].checked = cb.checked; 
} 
} 
</script> 
<!-- End of Javascript function --> 
<apex:form > 
<apex:outputfield value="{!Customer_Product_Line_Item__c.Opportunity__c}"/>
<apex:sectionHeader title="Select Customer Products to Attach"/> 
<apex:pageblock > 
<apex:pageBlockSection title="Search Customer products" columns="1"></apex:pageBlockSection> 

<!-- Div to give a colored box effect --> 

<div>

<!-- Panel grid to display boxes o accept user input values --> 
<apex:panelGrid columns="2"> 
<apex:outputLabel style="font-weight:bold;" value="Customer Product" ></apex:outputLabel> 
<apex:inputText value="{!userinput}"  onkeydown="if(event.keyCode==13){this.blur();actionFunction();}" />
</apex:panelGrid> 
<!-- End of panelgrid --> 
<!-- Div to position the commandbutton appropriately --> 
<div style="position:relative;left:75px;"> 
            <apex:pageBlockButtons >
                <apex:commandButton value="Search" action="{!Search}" rerender="table"/>
                <apex:commandButton value="Add Customer Product"/>
            </apex:pageBlockButtons>
</div> 
<!-- End of div --> 
<br/> 
</div> 

<!-- End of colored box div --> 
<br/> 
<!-- Display error message --> 
<!--apex:pagemessage strength="2" title="Error!!" severity="error" detail="Please select a contact or enter email address to proceed" rendered="{!errormsg}"/ --> 
<!-- End of error message --> 

<apex:pageblocksection columns="1" title="Search results" > 
<apex:outputpanel id="Productlist"> 

<apex:pageBlockTable value="{!productlist}" var="cCustomer" id="table"> 
<apex:column > 
<apex:facet name="header"> 
<apex:inputCheckbox onclick="checkAll(this)"/> 
</apex:facet> 
<apex:inputCheckbox value="{!cCustomer.Selected__c}" id="selectLine1"/>
</apex:column> 
<apex:column headervalue="Customer Product Name"> 
<apex:outputtext value="{!cCustomer.Name}"/>
</apex:column> 
<apex:column headervalue="Product Condition"> 
<apex:outputtext value="{!cCustomer.Product_Condition__c}"/>
</apex:column> 
</apex:pageBlockTable> <br/><br/> 

</apex:outputpanel> 
</apex:pageblocksection> 
<!-- End of search results --> 

</apex:pageblock> 
</apex:form> 
</apex:page>

  and the class:

 

public class VisualforcewrapperClassController {
    public VisualforcewrapperClassController(ApexPages.StandardController controller) {

    }


    public String results { get; set; }

    public String errormsg { get; set; }

    public PageReference contactsearch() {
        return null;
    }
    public String userinp { get; set; }

    public String userinput { get; set; }

    //Our collection of the class/wrapper objects Customer_Product_List_Item__c 
    public List<Customer_Product__c> productList {get; set;}
    
   //This method uses a simple SOQL query to return a List of Customer Products
    public List<Customer_Product__c> getproduct(){
        if(productList== null){
            productList= new List<Customer_Product__c>();
        
            for(Customer_Product__c c : [select Id, Name, Product_Condition__c, selected__c from Customer_Product__c where Name =:userinput]){
                /* As each contact is processed we create a new Customer_Product_List_Item__c object and
                add it to the productList*/
                productList.add(c);
            }
        }
        return productList;
    }
    
    public PageReference search(){
        /*We create a new list of Contacts that we be populated only with Contacts
        if they are selected*/
        List<Customer_Product__c> selectedProducts = new List<Customer_Product__c>();
        
        /*We will cycle through our list of cContacts and will check to see if the 
        selected property is set to true, if it is we add the Contact to the 
        selectedContacts list. */
        for(Customer_Product__c cCon: getproduct()){
            if(cCon.selected__c == false){
                selectedProducts.add(cCon);
            }
            }
         
        /* Now we have our list of selected contacts and can perform any type of 
        logic we want, sending emails, updating a field on the Contact, etc */
        System.debug('These are the selected Contacts...');
        for(Customer_Product__c con: selectedProducts){
            system.debug(con);
        }
        return null;
    }
 
    /* This is our wrapper/container class. A container class is a class, a data 
    structure, or an abstract data type whose instances are collections of other 
    objects. In this example a wrapper class contains both the standard salesforce 
    object Contact and a Boolean value */
    public class cCustomer {
        Public Customer_Product_Line_Item__c pli {get; set;}
        public Customer_Product__c con {get; set;}
        public Boolean selected {get; set;}
        
        /*This is the contructor method. When we create a new cContact object we pass a 
        Contact that is set to the con property. We also set the selected value to false*/
        public cCustomer(Customer_Product__c c){
            con = c;
        }
}
}

 

Thanks