Search code examples
javascriptiframesubmit

Submitting a form in an iframe with JavaScript

The iframe is on the same domain, I tried the following code, but none of it worked:

 myframe.document.getElementById("myform").submit();
 parent.top.frames[0].document.forms[0].submit(); 
 myframe.document.getElementById("myform").submit();

 MyIFrame = document.getElementById("myframe");
 myIFrame.getElementById("myform").submit();

Update:

This is the HTML:

<html>
<body>
<iframe frameborder="0" scrolling="no" width="530" height="298"
  src="/iframe.php" name="myframe" id="myframe">
  <p>iframes are not supported by your browser.</p>
</iframe><br />

<form action="/styles.css" method="post" id="form1">
<input type="text" name="input1" value=""/>
<input type="text" name="input2" value=""/>
<input type="button" value="test" onclick="submitFrame()">
<input type="submit" value="submit">
</form>

<script>

function submitFrame(){

var MyIFrame = document.getElementById("myframe");
var MyIFrameDoc = (MyIFrame.contentWindow || MyIFrame.contentDocument);
if (MyIFrameDoc.document) MyIFrameDoc = MyIFrameDoc.document;
MyIFrameDoc.getElementById("myform").submit(); // ## error 

}


</script>   
</body>
</html>

iframe.php:

<form method="post" class="af-form-wrapper" id="myform" name="myform" action="/"  >

<input type="text" name="input1" value="2073809442" />
<input type="text" name="input2" value="1" />
<input type="submit" name="submit" value="submit" />
    </form>

Firebug says:

 MyIFrameDoc.getElementById("myform").submit is not a function
Solution

  • Try this:

    var MyIFrame = document.getElementById("myframe");
var MyIFrameDoc = (MyIFrame.contentWindow || MyIFrame.contentDocument);
if (MyIFrameDoc.document) MyIFrameDoc = MyIFrameDoc.document;
MyIFrameDoc.getElementById("myform").submit();

    UPDATE

    I can't figure out why this doesn't work, but here is something that does:

    MyIFrameDoc.getElementById("mybutton").click();

    iframe.php:

    <input type="submit" name="submit" value="submit" id="mybutton" />

    UPDATE 2

    The reason you're getting the submit is not a function error is because you've named your submit button submit, so MyIFrameDoc.getElementById("myform").submit actually references an HTMLInputElement, not the HTMLFormElement.submit() method.

    All you need to do is rename your submit button, e.g.:

    <input type="submit" name="submit2" value="submit" />