POST from an <A> tag

HtmlPost

Html Problem Overview


Is it possible to do a POST from just an <a> tag? I know anchor tags are usually just for GETs, and I know I can use javascript to do this (like in https://stackoverflow.com/questions/133925/javascript-post-request-like-a-form-submit) but to me that seems a little messy. Is there a way to do this with straight HTML?

Html Solutions


Solution 1 - Html

Not really, no. You can, however, do something like this:

<form action="theUrl" method="POST">

<input type="hidden" name="param1" value="val" />
<input type="hidden" name="param2" value="val2" />

<a href="#" onclick="this.parentNode.submit()">Go to that link!</a>

</form>

You should find a better way, though. This one does not degrade gracefully.

Solution 2 - Html

There is no way to POST an a element using only HTML.

As can be seen from this DTD fragment (HTML 4.01 spec):

<!ELEMENT A - - (%inline;)* -(A)       -- anchor -->
<!ATTLIST A
  %attrs;                              -- %coreattrs, %i18n, %events --
  charset     %Charset;      #IMPLIED  -- char encoding of linked resource --
  type        %ContentType;  #IMPLIED  -- advisory content type --
  name        CDATA          #IMPLIED  -- named link end --
  href        %URI;          #IMPLIED  -- URI for linked resource --
  hreflang    %LanguageCode; #IMPLIED  -- language code --
  rel         %LinkTypes;    #IMPLIED  -- forward link types --
  rev         %LinkTypes;    #IMPLIED  -- reverse link types --
  accesskey   %Character;    #IMPLIED  -- accessibility key character --
  shape       %Shape;        rect      -- for use with client-side image maps --
  coords      %Coords;       #IMPLIED  -- for use with client-side image maps --
  tabindex    NUMBER         #IMPLIED  -- position in tabbing order --
  onfocus     %Script;       #IMPLIED  -- the element got the focus --
  onblur      %Script;       #IMPLIED  -- the element lost the focus --
  >

There is no attribute that controls whether to use POST or GET with an a element.

You have to script it, if you want to abuse the semantics.

Solution 3 - Html

Basically, you can't use an anchor tag for a POST request. However, there is a simple hack to achieve this.

<form id="myform" method="post" action="target.html"></form>
<a onclick="document.getElementById('myform').submit();">Submit to action</a>

Tested and working fine.

Solution 4 - Html

You can use CSS to make an <input type="submit"> look like a hyperlink.

Solution 5 - Html

In case it serves somebody:

<a href="/your-route"
    onclick="event.preventDefault();
    document.getElementById('magic-form').submit();">
    Magic Action
</a>
<form id="magic-form" action="/your-route" 
      method="POST" style="display: none;">
      {{ csrf_field() }} <!-- from your framework -->
      <input type="hidden" name="field1" value="value1" />
      <!-- other fields -->
</form>

Solution 6 - Html

Simple answer: no. You need to use javascript to do this kind of thing; since when you do a POST what you're doing is sending the data in the HTTP request. With get you're just sending it as part of the string (thus you can do it through the href value).

Solution 7 - Html

No clearly not without a javascript submit().

Solution 8 - Html

No there's no way to do this without the use of scripting. Although you can use CSS to style a standard Submit button to look and act more like an tag.

Solution 9 - Html

The 2 ways I think about are with JavaScript (as you said) or through server-scription.

You'd basically send the GET request (with the A) to some server file, which would change the GET vars to POST and then re-submit instantly (redirect location). But that would mess the referer stats I think.

Solution 10 - Html

You should to add data-method="post"

For example: <a href="/some-link" data-method="post">Logout</a>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionCarrotman42View Question on Stackoverflow
Solution 1 - HtmlRy-View Answer on Stackoverflow
Solution 2 - HtmlOdedView Answer on Stackoverflow
Solution 3 - Htmltk_View Answer on Stackoverflow
Solution 4 - HtmlSLaksView Answer on Stackoverflow
Solution 5 - HtmlnasatomeView Answer on Stackoverflow
Solution 6 - HtmlMarioRicaldeView Answer on Stackoverflow
Solution 7 - HtmlVGEView Answer on Stackoverflow
Solution 8 - HtmlDanView Answer on Stackoverflow
Solution 9 - HtmlecchymoseView Answer on Stackoverflow
Solution 10 - HtmlIryna BatvinaView Answer on Stackoverflow