Frontendplace Blog

Sharing Frontend developing ideas

Prevent paste action in text field

Posted by info on April 18th, 2008

Some people don’t want to allow pasting text inside a textfield where the user must confirm a value entered. Like in confirm email adress or confirm password field.
But how do we prevent this?

In Firefox this is not so easy to do, because pasting can be done with keyup events but also with dragging text and pasting text with right mouseclick. So if someone has an idea how to do this efficient let me know;

In IE there are two extra events: onPaste and onDragEnter. With these events you can prevent dragging text inside a field and pasting values eighter with right mouseclick or with a keypress:

example:

<p>Copy and paste this text into the textarea element. or drag text inside textfield</p>
<input type=”text” id=”confirmpass” onPaste=”alert(‘Pasting is not allowed’);return false;” onDragEnter=”event.returnValue = false;” />

Off course you can also add these events as eventhandlers like:
document.getElementById(‘confirmpass’).onpaste = function(){alert(‘Pasting is not allowed’);return false;}