Set HTTP request body parameters on hyperlink request

Question

Is there a way using Javascript or JQuery, to add parameters to an outgoing HTTP request launched by click of an anchor tag?

Set the `onclick` event, handle the request manually, for instance using `$.ajax()` — , May 23 '17 at 17:09
@ChrisG, thanks for replying...how do I add parameter to body - and not to the URL string itself? — lenniekid, May 23 '17 at 17:19
https://stackoverflow.com/questions/18697034/how-to-pass-parameters-in-ajax-post — hampusohlsson, May 23 '17 at 17:23
I don't see any HTML/JS/JQ lines in your question - Your question is not clear. Please create [mcve] and describe what you tried. — Alon Eitan, May 23 '17 at 17:24
And on a sidenote - You already asked 29 questions (which is totally fine BTW), and some of them were answered but you never accepted any answer. If some answers are **helpful**, please consider [accepting](https://stackoverflow.com/help/accepted-answer) them — Alon Eitan, May 23 '17 at 17:28
@AlonEitan, (and those voting to close due to lacking a MCVE) A [mcve] is *only required* for debugging questions. This does not appear to be a debugging question, thus a MCVE is not required (which makes the lack of a MCVE an invalid reason to close this question). An attempt to code/solve the problem is only required for homework questions, but this does not appear to be a homework question. Questions on SO do not *inherently* require code. However, code can be *very* helpful to define, clarify and limit the scope of a question. Code is often the best way to describe/illustrate questions. — Makyen, May 23 '17 at 23:42
@Makyen I do know that this is not required, but if the user is tagging this questions under `js` + `jq` + `html` then it **must** be about code, and it's unclear what they are asking. So yes - A clarification is required here, it could be a mcve or an edit that explain the question better. Now it's also time to downvote because the OP had enough time to do that — Alon Eitan, May 24 '17 at 04:57

score 0 · Answer 1 · answered May 23 '17 at 17:37

You can use a click handler in Javascript or jQuery, prevent the default to avoid immediate redirection, and then access the href property to add parameters. Then use window.location to redirect the user.

jQuery Example

$('#example').on('click', function(e){
    e.preventDefault();
    var urlString = $(this).attr('href');
    var newURL = urlString + "?query=param";
    window.open(newURL, '_blank');
});

score 0 · Answer 2 · answered May 23 '17 at 18:19

A click handler which passes body content can use AJAX to post content—which passes data in the request body. The easiest way to ensure data is passed in the request body is to set method: "post" and data: … attributes of the object passed to ajax(). With the ajax call, this all happens behind the scenes (i.e., the page is not actually displayed).

For page content that includes an anchor tag, like,

<a id='link' href='requestecho.php'>This is a link</a>

the following jQuery/JavaScript would apply:

function grabLink(event) {
   $.ajax({
      url: event.target.href,
      method: 'post',
//    contentType: 'text/plain',
      data: {body: 'content sent to server'},
      success: function (result) {
         // do what you will with result…
      }
   })
   event.preventDefault();
   return false;
}
$(function () {
   $('#link').click(grabLink)
})

You can set the contentType, data, and/or dataType attributes of the object passed to ajax(), as appropriate.

Set HTTP request body parameters on hyperlink request

2 Answers2