Change get to post

Question

Currently I have this url to send data to another page.

function clickBtn(){
    window.location.href =`/dashboard?id=12&name=test
}

Now I want to send this by post.

However it is said window.location.href is impossible to use for post

So I made this form however it is not javascript and also require user to click submit button.

<form action=dashbaord>
<input type=hidden id=id value=12>
<input type=hidden id=name value="test">
<input type=submit>
</form>

Is there any more equivalent way to the window.location.href?

Does this answer your question? [Send POST data using XMLHttpRequest](https://stackoverflow.com/questions/9713058/send-post-data-using-xmlhttprequest) — Ivar, Mar 24 '21 at 09:57
Why do you want to use JavaScript? Your HTML code has very similar behavior. You click on submit and your location is changed. It's like before but now it's a POST request. — jabaa, Mar 24 '21 at 09:59
@LawrenceCherone How do you use AJAX to navigate to a new URL as POST request? OP asks _"Is there any more equivalent way to the `window.location.href`?"_ — jabaa, Mar 24 '21 at 10:01
@Ivar How can you use XMLHttpRequest to navigate to a new URL as POST request? OP asks _"Is there any more equivalent way to the `window.location.href`?"_ — jabaa, Mar 24 '21 at 10:02
@jabaa fair point, ok the OP could use the bubbled click event and build out the form and submit it, dupe of: https://stackoverflow.com/questions/8003089/dynamically-create-and-submit-form — Lawrence Cherone, Mar 24 '21 at 10:05
@jabaa It's not obvious to me at all that it is a requirement to navigate to the other page. All I know is that they "_have this url to send data to another page_". If this doesn't answer the question, it is up to OP to clarify it in their question why it doesn't. — Ivar, Mar 24 '21 at 10:07
@Ivar _"Is there any more equivalent way to the `window.location.href`?"_ is pretty clear for me. Try it in your browser console. It will always navigate. — jabaa, Mar 24 '21 at 10:10
Equivalent in what way @jabaa? That you can send data from one page to another? Because that's also possible with AJAX. The equivalent of `window.location.href` would also send a GET request which is obviously not what OP wants. You'd be surprise how often [XY Problem](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem)-questions are asked. — Ivar, Mar 24 '21 at 10:15
@Ivar OP want's equivalent behavior to `window.location.href =\`/dashboard?id=12&name=test\`` but it should be a POST request. `dashboard` is probably a path on the site that contains a dashboard for a user with `id` and `name`. OP probably doesn't want the credentials in the URL. The use-case and the requirements are pretty clear. AJAX won't help here. — jabaa, Mar 24 '21 at 10:18
@jabaa I see your point, but am not convinced that is actually what OP is after. As I read it, their goal is to send data from one page to another, and they _attempted_ to use `window.location.href` due to lack of an alternative. Read the link in my previous question about XY-Problems. It's a common phenomenon here at Stack Overflow. You _might_ be right. But in that case OP should clarify it in their question. — Ivar, Mar 24 '21 at 10:21
Does this answer your question? [navigate to another page with post request through link](https://stackoverflow.com/questions/17378619/navigate-to-another-page-with-post-request-through-link) — Bertrand, Mar 24 '21 at 10:26

score 0 · Answer 1 · answered Mar 24 '21 at 10:42

You can create a form via JavaScript, append input fields on it and then post it which will change window location as well. Give it a try:

function PostForm(PostTo, DataParams) {

  const Form = document.createElement('form');
  Form.action = PostTo;
  Form.method = "post";

  for (const Param in DataParams) {

      const HiddenField = document.createElement('input');
      HiddenField.type = 'hidden';
      HiddenField.name = Param;
      HiddenField.value = DataParams[Param];
      Form.appendChild(HiddenField); //append to form  
  }

  document.body.appendChild(Form);
  Form.submit();
}

Then Use it like:

function clickBtn(){
    PostForm('/dashboard/', {name: 'test', id: '12'});
}

Change get to post

1 Answers1