Enter Key Clearing All Form Fields. How To Detect and Block [closed]

Question

I have a number of visualforce forms. When I hit the enter key while filling out the forms it clears out all form fields. Is there a way I can globally detect if the enter key has been clicked and fire an action function which submits my form vis my submit function or does every single input field require an onKeypress listener?

i basically want to stop my form fields from being cleared when they should not be when an enter key is clicked. My form submit function in my controller is not called, it just clears the fields.

Any tips on this woule be very much appreciated. It applies to a number of forms so could be an issue in general.

If I could disable the enter key function it might help but I'm guessing for accessiblity that is not a good approach.

Is there a way in Salesforce visualforce forms to detect if an enter key has been pressed in any apex:inputField on the form?

Thanks.

Answer 1

I believe the issue you are experiencing is that it is trying to use a forms default POST functionality. I have resolved this in the past by adding this javascript method below:

<script type='text/javascript'>
    function noenter(ev)  {
        if (window.event && window.event.keyCode == 13 || ev.which == 13) {
            modal.open();
            runSearch();
            return false;
         } else {
              return true;
         }
     }
</script>

I call the method noenter from my VF page like so, attaching it to the onkeypress event and checking the event keycode to determine what button was pressed. If the enter button was pressed - I want some code to run and so call those methods there but you could prevent an action or add a different action in the contents of the noevent's if statement.

<apex:pageBlockSectionItem >
       <apex:outputLabel value="Site Country" for="country" />
             <apex:selectList id="country" value="{!country}" size="1"
                 onkeypress="return noenter(event);">
             <apex:selectOptions value="{!countries}" />
       </apex:selectList>
 </apex:pageBlockSectionItem>

Updated code to capture event globally instead of input field specific:

$(document).keydown(function(e){
if (e.keyCode==90 && e.ctrlKey)
    $("body").append("<p>ctrl+z detected!</p>");
});

Source: https://stackoverflow.com/questions/2878983/capture-key-press-without-placing-an-input-element-on-the-page

The author of the answer states that the JQuery documentation recommends using the e.which instead of keyCode. The link also describes a difference in browser implmentation that you may want to checkout if something isn't working quite right. If all else fails just start outputting info to the console until you find something that works in all your scenarios.