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
HarryHHHarryHH 

strange behavior when capturing "enter"

Helleo,

 

I want to capture the enter-key when a User enters a searchText and then hits enter, so that the corresponding search button is clicked. I've got it so far, that the systems searches what it is expected and displays the results. But then the system goes to the next page (the enter-key is obviously still in action). How can I make this key/event null?

 

My Javascript:

<script type="text/javascript">

function doSearchOnEnter(element,e) {

var keynum = 0;

if (window.event) {

   keynum = window.event.keyCode;

} else if (e.which) {

   keynum = e.which;

}

alert("Element " + Element);

alert("e.which " + e.which);

if (keynum == 13) {

   var mySearchButton = document.getElementById('{!$Component.Kundenform.Kundensuche.Suchsection.btnSearch}');

   if (mySearchButton != null) {

        mySearchButton.click();

    } else {

        alert('was not found.');

    }

}

e = null;

element = null;

alert("Element " + Element);                                                              ****** here the system displays the searchresults *******

alert("e " + e);                                                                                        ****** if I pass this line the systems jumps to the next page *************

return false;

}

 

</script>

 

The corresponding VF code:

 

              <apex:inputText id="searchText" value="{!searchText}" onKeyPress="doSearchOnEnter(this,event)"/>

              <apex:inputText style="display:none"/>

              <apex:commandButton id="btnSearch" action="{!Kundensuche}" title="Kundensuche" alt="Kundensuche" value="Kundensuche" rerender="Kundenblock" status="Status"/>

 

Can anyone help?

Thanks

Harry

Pradeep_NavatarPradeep_Navatar

window.event does not work in Mozilla Firefox it works for internet explorer.

 

Tryout the below sample code to get workaround on this :

 

                                    if(window.event) // IE

                                                {

                                                                keynum = e.keycode;

                                                }

                                                else{keynum = e.which;} // Mozilla firefox
HarryHHHarryHH

Hello Pradeep,

 

thaks for your comment, but these are not the lines that don't work. I am working with Mozilla Firefox and the problem is, that enter is captured and the results are displayed for an instant, but then the next page is displayed. It seems that the enter is still active for the next input. How can I avoid that?

 

Thanks Harry
Pradeep_NavatarPradeep_Navatar

The problem is with the apex CommandButton, it usually reload/redirect/refresh the page so try to avoid the use of apex commandButton and in place of this use ActionFunction. Below is the sample code to detect the enter key and take some action.

 

            <apex:inputText  value="{!searchText}" />

             <apex:inputText style="display:none"/>

             <!-- apex:commandButton action="{!Kundensuche}" title="Kundensuche" alt="Kundensuche" value="Kundensuche" rerender="Kundenblock" status="Status"/ -->

             <apex:actionFunction action="{!Kundensuche}" rerender="Kundenblock">

                        <apex:param assignTo="{!propSearchText}" value="" />

            </apex:actionFunction>
HarryHHHarryHH

Hello Pradeep,

 

thanks for your help. I tried it now with the following code, but got the same behavior as before:

 

              <apex:inputText id="searchText" value="{!searchText}" onKeyPress="doSearchOnEnter(this,event)"/>
              <apex:inputText style="display:none"/>
              <apex:actionFunction id="btnSearch" name="Kundensuche" action="{!Kundensuche}" rerender="Kundenblock" status="Status">
                  <apex:param assignTo="{!searchText}" value=""/>
              </apex:actionFunction>

Do you have any more ideas?

 

Thanks

Harry