#WebDev

How to Fix 'An invalid form control with name=" " is not focusable'

by Radu

I’m still in practice mode with Laravel, and today I added TinyMCE to the posts’ textarea.

Adding it was very easy, but I noticed that I can’t submit the post anymore because of this error I found in Chrome’s Console:

An invalid form control with name='body' is not focusable.

Luckily, the fix is easy.

What’s Causing This Error?

Basically, this is caused by the required HTML attribute if the tag uses hidden or is somehow hidden via JavaScript code.

At least that’s what I understood from here.

I didn’t use the hidden attribute, so it must have been the JavaScript behind the TinyMCE editor.

The Fix

Anyway, all you have to do is to remove the required attribute from the tag, and the error should go away.

required textarea

You can add server-side validation for that because it’s better anyway. I tend to do both.

That’s a Wrap

I hope this guide helped you, and you managed to get rid of the “An invalid form control with name=’ ’ is not focusable.” error.

If some info is outdated or incorrect, or you have anything to add, say or ask, please contact me via Twitter or email.

Looking for a modern & optimized presentation website?

Hire me on Fiverr

About Radu

I've been working online, from home, for over 11 years, and I learned a lot of different things related to websites. My main expertise is WordPress, but for some time, I also started focusing on web development.