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
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" />
Submit the Iframe's URL from javascript
if (window.parent.$("#IframeId").length > 0) {
window.parent.$("#IframeId")[0].contentDocument.forms[0].submit();
}
Much thanks for your tip.
I was using a JavaScript to validate some information on a form before it was sent. the "MyIFrameDoc.getElementById("mybutton").click();" worked, but it clashed with my submit button which called an "onclick()" function. To work-around, I changed my orginal submit button to a button class with the "onclick()" function. Then I created a new submit button type="submit" with id="mybutton" with a style="width:1px;height:1px;border:0;" in essence making the new submit button invisible and placed it above the button class with the "onclick()" function. The user clicks the button class button, and the "onclick()" script validates the information. If it validates, the validation scripts calls "MyIFrameDoc.getElementById("mybutton").click();" and submits the form.