Why a form tag without action reloads the page?

Question

So we know that the action attribute used for sending the form data to a web server.

But I have a couple of questions:

• If the action attribute is not set, why does it reload the page by default?
• Shouldn't be the default behavior, not reload the page if it's not set?
• If there a spec to cover this case?
• In this times in javascript, we use a lot async server calls using SPA, and others Technics, is there a plan to change this in the future?

Answer 1

The form tag was always meant to submit the form to a server, and the original definition of the action attribute reflects this.

The program that will handle the completed and submitted form (the action attribute).

The action attribute was actually a required attribute in HTML 4 and thus would be invalid if not specified.

In HTML5 it is not required, but defaults to the current page's URL.

The action IDL attribute must reflect the content attribute of the same name, except that on getting, when the content attribute is missing or its value is the empty string, the document's address must be returned instead.

The method attribute controls how the action attribute will be called. Its default value is GET , meaning an HTTP call will be made.

The invalid value default for these attributes ( ed. the method and formmethod ) is the GET state. The missing value default for the method attribute is also the GET state.

Thus, if you don't specify either attribute, the default is to make an HTTP GET call to the page you are currently on. You should see any form element's names and values in the URL as query string parameters.

As far as I know, there are no plans to change these defaults, as it would break a large number of forms on the internet.

Answer 2

The form's action attribute defines to which location the form data should be posted, the default value is the current location. So in your case the form generates a GET action to the current page, which you probably don't handle on your server, which therefore just again returns the page.

If you use JavaScript to deal with your data and AJAX requests to post it you maybe don't even need to use forms. If you want to use a form and not reload the page, you have to call event.preventDefault(); in the form's submit handler.