79

I'm reading a book on html development (which I'm fairly new at) and despite the fact that the book just had its 1st publishing one month ago (Nov. 2011), the author is an experienced coder and maybe using # for the action in a form is old school?

Because I'm trying to get the gist of the sample code and I cannot find an explanation of form action="#" despite searching for

<form action="#">   

on google, on SO, and in www.w3schools.com.

Anyone know what the # action means for forms?

serv-inc
  • 35,772
  • 9
  • 166
  • 188
SandHawkerTech
  • 825
  • 1
  • 8
  • 8

4 Answers4

88

Action normally specifies the file/page that the form is submitted to (using the method described in the method paramater (post, get etc.))

An action of # indicates that the form stays on the same page, simply suffixing the url with a #. Similar use occurs in anchors. <a href=#">Link</a> for example, will stay on the same page.

Thus, the form is submitted to the same page, which then processes the data etc.

Giacomo1968
  • 25,759
  • 11
  • 71
  • 103
MEURSAULT
  • 8,307
  • 4
  • 24
  • 23
  • Why would you do this for a form action? An anchor I understand, but not a form. – Nik Dec 06 '11 at 04:18
  • 3
    @Nik because some times your server actions are simple enough to operate on one page. I use this often when building a simple database lookup page in PHP. It's simpler than having two pages for your simple actions. – Joseph Marikle Dec 06 '11 at 04:19
  • 2
    The page just posts back to itself then? – Nik Dec 06 '11 at 04:21
  • 2
    exactly, although, I don't see how action="page.php" is different than action="#" (Assuming page.php is the current page) Both end up refreshing the page, consider ajax submission instead. – MEURSAULT Dec 06 '11 at 04:22
  • 2
    @Nik that is correct. And on that page you build decision logic on whether to process posted input or just wait for the submit. – Joseph Marikle Dec 06 '11 at 04:22
  • 1
    I would use `action=""` to avoid confusion, since the point it to post to the page, not to an anchor on the page. However `action="#results"` might make sense. – Myster Mar 07 '18 at 03:37
  • @JosephMarikle As a beginner, I want to clear my doubt. Should those pages be prevented from developing where both HTML and PHP codes are merged in a single page with HTML serving the purpose of client interaction like forms and PHP serving as the reply to such HTML forms like printing some results based on whether a button in a form is clicked? – asn Apr 20 '19 at 09:53
  • @Myster `action=""` works but doesn't validate. `action="?"` will clear out existing query string values which may not be desirable. Doing `action="#"` is useful when you have separate GET and POST handlers serverside...ie GET renders the form and POST processing form data. Doing this allows you to avoid hardcoding a URI into your form in case you re-map your URLs/routes later (risking your clientside html template form `action` getting out of sync with your server side route handlers). – mattpr Oct 23 '19 at 12:24
31

action="" will resolve to the page's address. action="#" will resolve to the page's address + #, which will mean an empty fragment identifier.

Doing the latter might prevent a navigation (new load) to the same page and instead try to jump to the element with the id in the fragment identifier. But, since it's empty, it won't jump anywhere.

Usually, authors just put # in href-like attributes when they're not going to use the attribute where they're using scripting instead. In these cases, they could just use action="" (or omit it if validation allows).

alecxe
  • 462,703
  • 120
  • 1,088
  • 1,195
Shadow2531
  • 11,980
  • 5
  • 35
  • 48
18

Apparently, action was required prior to HTML5 (and # was just a stand in), but you no longer have to use it.

See The Action Attribute:

When specified with no attributes, as below, the data is sent to the same page that the form is present on:

<form>
Community
  • 1
  • 1
Huntario
  • 1,120
  • 12
  • 18
4

The # tag lets you send your data to the same file. I see it as a three step process:

  1. Query a DB to populate a from
  2. Allow the user to change data in the form
  3. Resubmit the data to the DB via the php script

With the method='#' you can do all of this in the same file.

After the submit query is executed the page will reload with the updated data from the DB.

Tim Delaney
  • 5,535
  • 3
  • 24
  • 18
Jorren
  • 98
  • 1
  • 10