How to send parameter to Iframe with a HTTP POST request

Question

I have to send some parameter to an IFRAME with POST method. I have read here Setting the HTTP request type of an <iframe> that it isn't possible. I'm thinking a solution in Javascript but I can't implement it so I can't test if it is a valid solution for this issue. I want to ask if someone has the same problem and if it is possible to solve and in positive case how to?

See http://stackoverflow.com/questions/168455/how-do-you-post-to-an-iframe — Julien Kronegg, Jun 05 '13 at 12:26

score 61 · Accepted Answer · answered Jul 18 '11 at 09:00

61

<form ... target="hidden_iframe">
...
</form>

<iframe name="hidden_iframe" ...></iframe>

answered Jul 18 '11 at 09:00

Walialu

4,096
2
27
29

1

just make the form invisible and the iframe too.. and then do a form submit via js – Walialu Jul 18 '11 at 09:04

score 31 · Answer 2 · answered Jul 18 '11 at 09:05

31

How about using the target attribute of the form to point to iFrame?

 <form target="myIframe" action="http://localhost/post.php" method="post">
    <input type="hidden" value="someval" />
    <input type="submit">
</form>

<iFrame src="" name="myIframe"></iFrame>

answered Jul 18 '11 at 09:05

KishoreK

892
5
14

4

What does post.php do? Why is this necessary? – Kalina Nov 13 '13 at 18:03
1

@Kalina this is late obviously but it is the url that you want to send the post request to – Troy Cosentino Dec 16 '14 at 22:11

score 23 · Answer 3 · answered Apr 15 '16 at 12:06

23

Just to give a concrete working example

<form id="loginForm" target="myFrame"  action="https://localhost/j_spring_security_check" method="POST">
 <input type="text" name="j_username" value="login" />
 <input type="text" name="j_password" value="password" />
 <input type="submit">
</form>

<iframe name="myFrame" src="#">
   Your browser does not support inline frames.
</iframe>

// Hide the form and do the submit 
<script>
 $(document).ready(function(){
 var loginform= document.getElementById("loginForm");
 loginform.style.display = "none";
 loginform.submit();
});
</script>

answered Apr 15 '16 at 12:06

user3420157

231
2
3

2

Using a hidden form and then submitting it does not makes sense. Why not just use an ajax request and populate the target div with the response received? – mobby May 14 '18 at 11:49
haven't you try it? – Josua Marcel C Oct 14 '18 at 05:42
how can I add headers? – Dzak Oct 31 '18 at 09:44

score 0 · Answer 4 · answered Apr 22 '21 at 09:08

Proposed solution works almost fine in my case, problem is that my form submitting returns an authorization cookie. Website that is rendering iframe is located on different domain that iframe website and this method returns me an error that I can't set the cookies. Is there a secure way to fix this?

How to send parameter to Iframe with a HTTP POST request

4 Answers4

Linked

Related