---
title: Double click prevention
---
<h1 class="heading-xlarge">
  <span class="heading-secondary">{{component.categories.primary}} / {{component.categories.secondary}}</span>
  {{component.name}}
</h1>

{{#markdown}}
Prevent people double clicking on form buttons by adding a `data-double-click-prevention` attribute to form buttons
{{/markdown}}


{{#capture 'form-element'}}
  <input type="text" name="foo" />
  <br><br>
  <input type="submit" class="button" value="Continue" id="button-1" data-double-click-prevention>
  <br><br>
  <button class="button" id="button-2" data-double-click-prevention>Continue</button>
{{/capture}}


<form method="GET" onSubmit="javascript:console.log('submitted');return false;">
  {{{form-element}}}
</form>

---
title: Double click prevention
---
<h1 class="heading-xlarge">
  <span class="heading-secondary">{{component.categories.primary}} / {{component.categories.secondary}}</span>
  {{component.name}}
</h1>

{{#markdown}}
Prevent people double clicking on form buttons by adding a `data-double-click-prevention` attribute to form buttons
{{/markdown}}


{{#capture 'form-element'}}
  <label for="foo">Use this field to test pressing Enter in the form</label>
  <input type="text" name="foo" id="foo" />
  <br><br>
  <input type="submit" class="button" value="Continue" id="button-1" data-double-click-prevention>
  <br><br>
  <button class="button" id="button-2" data-double-click-prevention>Continue</button>
{{/capture}}


<form method="GET" onSubmit="javascript:console.log('submitted');return false;">
  {{{form-element}}}
</form>

Add label to input element
Add label to input element
