oTree Forum >

Enter Button on Keyboard Submitting Form

#1 by lzrill ,

Hello,

Is there a way to prevent subjects from using the enter key on their keyboards to submit a form? I have a delayed next button but they can get around this by pressing the enter key.

Thanks,
Lanny

#2 by BonnEconLab ,

Hi Lanny,

I am using the following JQuery-based JavaScript code for this purpose in a current experiment:

<script>

// Disable "Enter" key to prevent submitting the form accidentally
$('html').bind('keypress', function(e) {
   if(e.keyCode === 13 || e.key == 'Enter') {
      return false;
   }
});

</script>

See also https://stackoverflow.com/questions/895171/prevent-users-from-submitting-a-form-by-hitting-enter.

Best,

Holger

#3 by BonnEconLab , (edited )

Hi again,

The following method to prevent participants from submitting a form by pressing “Enter” might be even safer:

Create an invisible input field:

<input id="Capture" type="number" required style="display: none;" />

Replace the standard {{ next_button }} by

<button class="otree-btn-next btn btn-primary" onclick="document.getElementById('Capture').value = 1;">Continue</button>

Since hitting “Enter” leaves the invisible input field empty, participants cannot proceed to the next page. Clicking the button, however, fills the field and the submits the form.

Best,

Holger

#4 by lzrill ,

Hi Holger,

The first method worked perfectly. Thank you for your help.

Lanny

Write a reply

Set forum username