Prevent use of spacebar when input field is empty

Question

I am making a chat application and i saw that whatsapp doesn't allow the use of space bar when there is no input yet, i did try to find it out in stack overflow itself but they gave the answer which worked only there, but when i tried in my react-app it showed this error: Unexpected use of 'event' no-restricted-globals I am confused what to do, i got this at the first time:

Then i went to the file and tried commenting the line(not sure if can), but that too didn't work for me. Like is there any other way i can achieve the same functionality without the use event

🚫📸 Please post code, errors, sample data or textual output here as plain-text, not as images that can be hard to read, can’t be copy-pasted to help test code or use in answers, and are barrier to those who depend on screen readers. You can edit your question to add the code in the body of your question. For easy formatting use the {} button to mark blocks of code, or indent with four spaces for the same effect. The contents of a screenshot can’t be searched, run as code, or copied and edited to create a solution. — tadman
– tadman, Commented Nov 10, 2020 at 9:54
` function keyhandler(e) { var e = window.event || e; var key = e.keyCode; //space pressed if (key == 32) { //space e.preventDefault(); } } ` — Gayatri Dipali
– Gayatri Dipali, Commented Nov 10, 2020 at 9:56
You shouldn't have to do the var e = window.event stuff, just use it as-is. — tadman
– tadman, Commented Nov 10, 2020 at 9:57
@GayatriDipali keydown={e => keyhandler(e)} try using this way. — Jai
– Jai, Commented Nov 10, 2020 at 9:59
@Jai That's just an empty wrapper that doesn't really solve the problem so much as introduces extra syntax that's not necessary. That approach is useful if you need to switch up the arguments before calling, but x => f(x) is almost always pointless in that context where f does the job. — tadman
– tadman, Commented Nov 10, 2020 at 10:13

tadman · Accepted Answer · 2020-11-10 09:56:17Z

1

What is keyhandler defined as? You should define it as function keyhandler(event) but inline it as onKeyDown={keyhandler} with no arguments.

You want to pass in a function to be called, not a specific function call. These are two different things.

The error indicates that event isn't what you think it is, that's resolved to window.event, it doesn't exist like you think it does, because that is now a function call with a static argument instead of the actual event that happened.

answered Nov 10, 2020 at 9:56

tadman

212k23 gold badges237 silver badges266 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Prevent use of spacebar when input field is empty

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related