why can't I copy and paste

Question

I have written this code in js to validate my text in an html input field. It works great except that I can't copy/paste anything into the textbox. How can I modify this to allow copy/pasting while not losing the validation functionality? Or is there a better way to validate a textbox?

function checkText(e)
{       
    var ok = /[a-z A-Z]/.test(String.fromCharCode(e.charCode));
    if (!ok)
        e.preventDefault();
}

How is this function linked to the input element? `onchange`? or one of the key events? — , Nov 06 '19 at 21:12
When you paste, there's no `e.charCode`. That only exists in keyboard events. — Barmar, Nov 06 '19 at 21:14

score 0 · Accepted Answer · answered Nov 06 '19 at 21:20

As it's been mentioned in the comments, the paste event does not have the charcode property. You can try the following to handle both events:

function checkText(e)
{       
   var str = String.fromCharCode(e.charCode) || (event.clipboardData || window.clipboardData).getData('text')
   var ok = /[a-z A-Z]/.test(str);
   if (!ok)
     e.preventDefault();
}

So you handle both the keyboard and the paste events. The paste event will have to be only one char though.

Bahador Raghibizadeh · Answer 2 · 2019-11-06T21:31:20.677

0

try it:

function checkInput(elem){
  let newValue = elem.value.split("").filter(chr => /[a-z A-Z]/.test(chr)).join("")
  elem.value = newValue;
}

<input onInput="checkInput(this);">

edited Nov 06 '19 at 21:31

answered Nov 06 '19 at 21:24

Bahador Raghibizadeh

1,155
11
23

@user2236794 so please mark it as the correct answer. – Bahador Raghibizadeh Nov 07 '19 at 10:43

why can't I copy and paste

2 Answers2