Restricting characters to input

Ask the community
,
4

There’re 2 options:

  1. If you use Wix inputs, you can only delete the character after it’s been typed.

  2. If you create your own custom input using an iframe or custom element (and write your own html, css), you can add a beforeinput event listener and prevent the character to appear in the first place. See example .

If you go for the first option, you should do something like:
Instead of onKeyPress, use onInput (that’s way you’ll catch copy-paste as well).

$w('#input).onInput(event => {
let allowdChars = 'abcd...';//you can do it differently with regex. But let's continue your way
let valArr = $w('#input').value.split('');
let processedVal = valArr.filter(e => allowedChars.includes(e)).join('');
$w('#input').value = processedVal;
})