Why you should always wrap form elements in a form tag

By on (tags: None, categories: web)

A simple ‘because it helps’ should be enough for most, but as for details…

Wrapping form elements in a form tag used to be the only way to go a few years back. That was the time when AJAX was not around. Then, the asynchronous processing came and it’s become common to skip that step, after all, the request is done in a different way.  To be honest, I’ve skipped this step a few times myself, but no more, and why?

Well, first let’s state the ‘smaller’ things:

  • adds semantics
  • helps screen readers
  • gives a fallback to when javascript is off/not available (which actually in these days with SPA pages is not a valid point because without javascript the whole page just won’t work)

but there’s one BIG reason why I decided never to skip that step again (actually, it’s not big at all, but it’s important for me) – when you use the form tag, the browser will do a submit when you press enter. As simple as that, and it’s one of the things you appreciate when you stumble on a page that doesn’t have it. Of course, you can do that in your javascript code as well, but why should you if the browser dos it for you…