function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
sandersensandersen 

How to submit form on <Enter>?

I have a simple search box that runs a method and rerenders part of the page. I want the User to hit enter in this box and have the search happen correctly. My method is running when the User hits enter, but the search always turns up zero results. If the User hits the Search button, the search runs correctly.

 

 

<apex:form >
     <apex:inputText value="{!searchText}" id="searchText"/>
      <apex:commandButton action="{!search}"  rerender="searchresults,selectedContacts,winnerpanel" value="Search" status="searchStatus"/>
     <apex:actionStatus startText="(searching...)" id="searchStatus"/>
</apex:form>
 My controller code looks like this:
 
public String searchText { get { return searchText; } set { searchText = value; } }
 
public void search() {
     if(searchText.length()>0){
          //reset booleans that control display of results elements
          displaySelected = false;
          successfulMerge = false;
          displaySearchResults = false;
          mySOSL();
          searchResults = wrapSOSLResults(searchList);
          //if we got a result back, show the search results pane
          if(searchResults.size()>0){
                    displaySearchResults = true;
          }
     }
}
 
 
The mySOSL method constructs a search string using the value in searchText. Any ideas why this would return no results when hitting enter on the form? It feels like the setter for searchText isn't running...but I'm not sure how to remedy that.
 
Thanks,
 
Steve 
 
 


bob_buzzardbob_buzzard
This is because when the browser detects a return key press in an input element, it carries out a standard submit on the form,  whereas you need to get it to use the submit associated with the button.
 
I've  used Javascript to achieve this in the past: 
 
 
<apex:inputText id="query" value="{!queryString}" onkeypress="return noenter();"/>
<apex:commandButton id="searchbtn" value="Search" action="{!doSearch}" />



   <script>
      function noenter() 
      {
         if (window.event && window.event.keyCode == 13)
         {
            var ele=document.getElementById('{!$Component.form.crit_block.searchbtn}');
            ele.click();
            return false;
         }
         else
         {
            return true;
         }
      }
   </script>
 
 
 
 So every time a key is pressed, the javascript function checks if it was the enter key.  If it was, it locates the search button and programmatically clicks it. 
 
 


sandersensandersen
Thanks for the tip! I got it to work. Here's my VF:
 
 
<apex:form id="searchForm">
     <script type="text/javascript">
          function noenter(e){
               if(window.event){
                    key = window.event.keyCode;     //IE
               } else{
                    key = e.which;     //firefox
               }
               if(key == 13) {
                    var ele=document.getElementById('contactMergePage:searchForm:searchButton');							             
                    ele.click(); 
                    return false;
               } else{
                    return true;
               }
          }
     </script>
 
     <apex:inputText value="{!searchText}" id="searchText" onkeypress="return noenter(event);"/>
 
     <apex:commandButton id="searchButton" action="{!search}"  rerender="searchresults,selectedContacts,winnerpanel" value="Search" status="searchStatus"/>
 
     <apex:actionStatus startText="(searching...)" id="searchStatus"/>
 
</apex:form>
 
 
 


DiscussionDiscussion
Hello I am using the below code as suggested above. It is working fine in IE but refreshing the whole page in Firefox. Below is the javaScript and VF code
 
<script type="text/javascript">
   function noenter(e){   
       if(window.event){
           key = window.event.keyCode;
        }else if(e.which){    
            key = e.which; //firefox
        }else if (e.keyCode){
           key = e.keyCode;
        }
        if(key == 13) {           
            var ele=document.getElementById('page1:form1:btnSearch');
            ele.click();
            return false;
        } else{
            return true;
        }
   }
</script>
 
 
            <div style="float:left; padding-right:5px; ">
             
                <apex:inputText id="searchLife" value="{!lifeSearchText}" onkeypress="return noenter(event);"/>
                      
                  
            </div>
            <div style="float:left; background-color:#FF6600; height:20px; padding-top:3px;">
                <apex:commandLink id="btnSearch" style="color:#fff; font-weight:bold;  
                  padding-top:3px; padding-bottom:1px; padding-right:5px; padding-left:5px; text-decoration:none;"
                  action="{!clickSimpleSearch}" rerender="container"
                  value="Search" status="searchStatus"/>
            </div>
 
Please suggest.