<head>
<TITLE> Sample CIM Implementation </TITLE>
<script type="text/javascript">
function init(){
document.forms[0].submit();
}
</script>
</head>
<BODY onload="init()">
<iframe id="authpopup" src="https://test.authorize.net/profile/manage">
</iframe>
<form type ="hidden" method="post" name="iframepopup" id="formAuthorizeNetPage" style="display:none;">
<input type="hidden" name="Token" value="<%=token%>"/>
</form>
</BODY>
</HTML>
i have a jsp page in which iam loading a iframe. The iframe is getting refreshed continuolusly i actually don want the iframe to get refreshed. This seems to flicker
As soon as the page loads, you call init(), which submits a form. This causes the page containing the iframe to reload, and thus also causes the iframe to reload. The page then calls init() again (since it has just reloaded) and so on.
Don't do that.
Related
I would like to send data to a web page through javascript. The code below works, however only with chrome. For example Firefox the code does not work. Do you know another method to send data when loading page that works on all browsers?
<html>
<head>
</head>
<body>
<form name="FormType" method="post" action="/welcome.php">
<input type="hidden" name="var1" value="abc">
</form>
<script type="text/javascript">
function autoClick () {
document.forms["FormType"].submit();
}
window.onload = autoClick;
</script>
</body>
</html>
I am using a third party software which uses the Prototype library. It was working fine before the latest update (Ver 68 and above) of Firefox. It is still working in the other browsers. I tried debugging and whenever I introduce a breakpoint and go step by step the code works. I found the following line of code which if I step over and let the code run the problem is solved. But if I let the code run before this the problem occurs.
return formView.submit();
Any idea? I am ok with a hack even.
Update:
I created a MRE as suggested. Here is the link https://brandsoftinfotech.com/test/firefox-frame-submit/
I have created 2 forms, one in the parent page and one in the frame. On submitting the parent page form the frame page form gets submitted and writes the data in a log file. And the form page when submitted just shows the data from that log file.
index.html
<!DOCTYPE html>
<html>
<head>
<script>
function submitFunction() {
var myFrame = document.getElementById("myFrame");
var myForm = myFrame.contentWindow.document.getElementById("myForm");
myForm.submit();
}
</script>
</head>
<body>
<form action="index-submit.php" onSubmit="submitFunction()">
<input type="submit" value="Submit">
</form>
<iframe id="myFrame" src="frame-box.html"></iframe>
</body>
</html>
frame-box.html
<form action="frame-submit.php" id="myForm">
First name:<br>
<input type="text" name="firstname" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br><br>
</form>
This works fine on Chrome, MS Edge but doesn't work on Firefox.
I am not sure if solving this would solve my problem, but at least this should work for my library code to work.
I'm mildly surprised to see that it works on any browser. By allowing the parent's form submission to occur, you're tearing down the page, which means tearing down the iframe, and any requests that may be underway can be aborted (or if not quite started, never started).
I'd probably switch to ajax rather than doing the actual form submission.
But if you want to do the form submission, to do this reliably you'll have to wait for the frame's submission to complete before doing the parent submission. The easy way to do that is to have the frame submission respond with a small page with JavaScript on it that tells the parent it's finish:
<!DOCTYPE html>
<html>
<body>
<script>
if (parent && parent.formCallback) {
parent.formCallback();
}
</script>
</body>
</html>
Then the parent page is something like:
<!DOCTYPE html>
<html>
<head>
<script>
function submitFunction() {
var myFrame = document.getElementById("myFrame");
var myForm = myFrame.contentWindow.document.getElementById("myForm");
myForm.submit();
return false; // <−−−−−−−− cancel submission
}
function formCallback() { //
document.getElementById("parentForm").submit(); // <−−−−−−−− Submit on callback
} //
</script>
</head>
<body>
<!-- vvvvvvvvvvvvvvv−−−−−−−− Added ID -->
<form id="parentForm" action="/index-submit" onSubmit="return submitFunction()">
<input type="hidden" name="index-field" value="x">
<input type="submit" value="Submit">
</form>
<iframe id="myFrame" src="frame-box.html"></iframe>
</body>
</html>
But you may get away with just detecting the change in location in the iframe. That would involve just changing the parent page as indicated:
<!DOCTYPE html>
<html>
<head>
<script>
function submitFunction(form) { // <−−−−−−−− Added parameter
var myFrame = document.getElementById("myFrame");
var myForm = myFrame.contentWindow.document.getElementById("myForm");
myForm.submit();
// Wait for the location of the iframe window to change
setInterval(function() {
if (String(myFrame.contentWindow.location).includes("frame-submit")) {
// Frame's form submitted, we can submit ours
form.submit();
}
}, 100);
return false; // <−−−−−−−− cancel submission
}
</script>
</head>
<body>
<form action="/index-submit" onSubmit="return submitFunction(this)">
<!-- ^^^^−−−−−−−−− added argument -->
<input type="hidden" name="index-field" value="x">
<input type="submit" value="Submit">
</form>
<iframe id="myFrame" src="frame-box.html"></iframe>
</body>
</html>
I wouldn't expect that to work if the form in the frame does a significant upload (though I could be wrong about that).
I need to find a way for a page to redirect you to a third party page with a login form and log in for you. Need to use it on a screen that can access pages but cant input anything to said page.
I've managed to create a html file that takes me to the page;
<html>
<head>
<script type="text/javascript" language="JavaScript">
window.onload = function() {
window.location.href = 'www.URL.com';
};
</script>
</head>
</html>
I have also figured out that if I paste the following in to the address field after opening the page it logs me in;
javascript:void(document.loginForm.name.value = 'MYUSERNAME');
javascript:void(document.loginForm.password.value = 'MYPASSWORD');
javascript:void(document.loginForm.submit())
I have not been able to combine the two though. Any thoughts?
Inspect the source of the form on the other site and look for the action attribute (probably something like action="/login/")
(also make an note of the method attribute)
Then make a form on your own page with the other sites action like this:
<form id="loginForm" action="http://othersite.com/login/" method="same as other site">
<input type=hidden name="name" value="MYUSERNAME"/>
<input type=hidden name="password" value="MYPASSWORD"/>
</form>
You can submit the form on page load with
<script>
window.onload = function() {
document.getElementById('loginForm').submit();
};
</script>
I want to know how we can open a web page in edit mode within an HTML page.
I mean, suppose if I have two frames. when I enter a url in a text in top frame, I should get the page in edit mode in bottom page. I should be able to select the items in the page in that mode. I don't want to save the items, but should be able to switch to the normal mode in a button click.
This is for getting Id/name/xpath of the elements in that page. if there are controls in a page which will navigate to other pages while clicking, I wouldn't be able to detect these parameters. If I am overriding all the click events, the controls under javascript tabs/accradian, will not be accessible.
Is there any ways to do it?
I coded as per one of the answer, but it is not working.
<!doctype html>
<html>
<head>
<title>click demo</title>
<script type="text/javascript">
function myFunc() {
doc = ifrm.contentDocument || ifrm.contentWindow.document;
doc.designMode = "on";
}
</script>
</head>
<body>
<input type="text" id="text" value="http://www.google.com" />
<input type="button" onclick="myFunc()" value="Open" /><br /><br />
<iframe id="ifrm" src="http://www.example.com" width="100%" height="500px" ></iframe>
</body>
</html>
you can convert any frame to design mode
iframe_node.contentDocument.designMode = "on";
I'm trying to read the contents of a document that is loaded via window.open:
<!DOCTYPE html>
<html>
<body>
<button onclick="openWin()">Open "newWindow" and read its content</button>
<script>
var myWindow;
function openWin() {
myWindow = window.open("http://www.google.com/",
"myWindow", "width=400, height=400");
myWindow.opener.document.write(myWindow.document.body.innerHTML);
}
</script>
</body>
</html>
How can I read the contents of a document after loading it via window.open?
I've tried this with setTimeout function but it didn't work.
This is working :
myWindow.opener.document.write("Done!!");
You can't do that if the document you're opening in a new window is from a different domain (for example, yoursite.com opening a new window that loads google.com). This is a security restriction known as same-origin policy. More information: Same-origin policy (MDN).
Hope this clarifies things a bit for you.
It can sometimes pay to try a few things.
My isp recently added a time stamp to their login form which prevented me using my local post form with preloaded name and password.
I looked for ways of downloading their login page and copying the time stamp to my local form. This would have been easy with almost any script except JavaScript.
Frames failed as they use the X-Frame-Option set to 'Deny'.
To my surprise I was able to copy the time stamp to my local form from a pop-up window containing their form. This now works well. The only slight imperfection was having to use a fixed timeout rather than detecting pop-up page fully loaded.
Here is the disguised full solution:
<html>
<head>
<base href='https://www.isp.net'>
<title>isp</title>
</head>
<body onload="w=window.open('login'); setTimeout('document.f.time-stamp.value=w.document.forms[0].time-stamp.value; document.f.submit(); w.close()',2000)">
<form name=f action='login' method=post>
<input type=hidden name='user-name' value='my-name'>
<input type=hidden name='password' value='my-password'>
<input type=hidden name='time-stamp' value=''>
</form>
</body>
</html>