Load another page when iframe loads - iframe

Hey all thx for your time!!.
I want to add a login page at my website. So, i am using iframe and centered it to show the username,password and connect button. But, i want my page to load the iframe page when user click the connect button inside the iframe.
First, i want them to add the username and password info. And click load, then the page reloads but keeps their info (i hope).
Here is the code
<iframe id="iframe" scrolling="no"
src="http://sms.altasoft.gr/panel/index.asp?lang=el&disp_function=user_login&id=5E8A0F4B-063B-4A7A-81FE-99579AF44BAA">
<p>Your browser does not support iframes.</p>
</iframe>

If the page loaded into the iframe uses some cookies to keep the log in information, this should work:
<script type="text/javascript">
window.onload = function(){
var iFrame = document.getElementById("iframe");
iFrame.onload = function(){
window.location = iFrame.src;
};
}
</script>

If I understand correctly, you're using an iframe and want to have the main page reload when the form inside the iframe has been submitted. Is that correct? If so, add ' target="_top"' to the form inside the iframe, and it should reload the whole thing.

Related

Detect Click On Iframe Then Do An Action

I want to add a iframe to my website that has a button in it and when someone clicks on it, it does an action like maybe forward to another page or echo a message. I don't care about the code whether its java, php, html, etc as long as it works. I'm good at coding certain things but this is not one of them, help me out please.
UPDATE:
the iframe is:
iframe src="http://ipget.tk" /iframe
when its clicked on I want it to go to google.com
the iframe will be on a test page on scazioco.com
Using Jquery you can bind an event to your IFrame :
$('#iframe_id').bind('click', function(event) {
window.location = http://www.google.com
});
Replace #iframe_id with the actual Iframe's ID

load page and iframe simultaneously through javascript

I had a page(Home.aspx) containing menu on the top and another master page, with same menu on the top.
Now, when i have to move from Home page to master page, i use
window.location = 'test.aspx';
Now, when i need to move from master to main(Home) page, i need to call a function with a parameter, containing control url, which has to be loaded to the iframe in the Home page.
Can anybody suggest how can i load Home page and iframe within simultaneously using javascript.
If you don't want the user interact with the page until the iframe is loaded, you can disable the page with javascript (onLoad of the page <body onload="disablePage()">) and enable again when the Iframe is loaded (onLoad of the Iframe <iframe onload="enablePage()"... )
Here some post about disable or gray out page: CSS/JavaScript Use Div to grey out section of page

Url of the loaded html in an Iframe

We have a customer portal site hosted externally.
I need to create a page in our company site where in employees will use the page to login to the portal. The login page they offer is generic
To implement this, I am planning to create a page and then iframe (width: 200px ; height:100 px) the login page of the customer portal. This way I can have the company branding on the login page..
But my problem is, when user logs in via the iframe, the resulting home page opens within the iframe window.
My question: is there a way to find the url of the page that is loaded in the iframe so that based on the url, I can change the dimensions of the iframe?
The src attribute of iframe always shows the login page url.
My Iframe code:
<iframe onload="loadMyFrame();" src ="https://login.tomyportal.com" width ="370" height="200" id="sWindow" frameborder="0"></iframe>
<script type="text/javascript" language="javascript">
function loadTest() {
var ifr = document.getElementById("sfWindow");
alert(ifr.src); //the value returned is always login page.
}
</script>
how about
alert(ifr.location.href)
?

Loading aspx page in JQuery UI dialog

I have a aspx page where I have a linkbutton and upon clicking that link button I am calling another aspx page passing a parameter in a pops up window, like below:
<asp:linkbutton id='lbtn1' onClick=<%#"window.open('/testsite/mypage.aspx?param=abcd');return false"%>
Till now it was working fine but now I have to include my page to another site where they have used JQuery for popup dialog and asked me to load my page using the same.
I am really new to JQuery and have no idea about. I tried searching through this forum and google but no luck.
Can someone please help me and show me how can I achieve this (please don't mind but a code example would be really appreciated).
A lot thanks.
Do you mean loading a page through an iframe into a modal/lightbox style? Try using a lightbox plugin or reading up on the jQuery UI dialog.
If you do decide to use the jQuery UI dialog, you can do something like this:
<div id="dialog">
<iframe src="page.html"></iframe>
</div>
...
$( "#dialog" ).dialog();
There is another way, though for the purposes of a modal popup an iframe seems a perfectly legitimate solution. But you could load all the html of the target page with an ajax query, and populate the modal dialog with it. Using jQuery:
<script type="text/javascript">
function showPanel(panelID)
{
$panel = $('#'+panelID);
$.ajax({
url: "/testsite/mypage.aspx",
type: "GET",
dataType: "html",
async: false,
data: { "param": "abcd"
},
success: function (obj) {
// obj will contain the complete contents of the page requested
// use jquery to extract just the html inside the body tag
$content=$(obj).find('body').html();
// then update the dialog contents with this and show it
$panel.html($content);
$panel.dialog();
}
});
}
</script>
<div id="dialog">
</div>
Then call this from your click event with the id of the panel.
<asp:LinkButton id="lbtn1" onClick="showPanel('dialog');return false;" />
Note: while this will probably work, if your intent to simply have a link do something on the client, a LinkButton doesn't really make sense, since it is by definition a postback control. So, if you want it to be rendered as a hyperlink for styling reasons, use a HyperLink control or just an HTML link. If not, just put a "div" or "span" around the link text or content and use jQuery to add a click event to it. There are lots of discussions on this sort of thing on SO.
The only way I can think to serve a dynamic aspx page where the page is built (partially or fully) serverside is to add an iframe to the popup and set it's target to the url you wish to load.
Hate iframes but I think this might be the only way.

How to load Ajax contents into a div on page load using FBML and FBJS?

I'm developing my first Facebook application in ASP.NET 2.0 and doing a simplest thing, that is, to show a navigation on top with four hyperlinks where each link targets to another .aspx page. How can I do this using FBML in ASP.NET 2.0?
Otherwise coming to my question, where I'm struck after trying above thing at myself and failed then had to go around the Ajax way of doing this. Now I'm using Ajax call over the onclick event of each hyperlink from top navigation and it's succesfully loading external .aspx pages (for example, http://apps.facebook.com/brand-is-everything/). The problem is when user comes on the application on first time, it only shows the .aspx page which has a navigation and a Ajax content place holder which is programmed to be filled with contents on click event.
How to load Ajax contents into the Ajax content place holder on page load without a click event?
Here an example on how to append HTML/FBML into a div after an AJAX call:
<script type="text/javascript">
var ajax = new Ajax();
ajax.responseType = Ajax.FBML;
ajax.ondone = function(response) {
document.getElementById('myDiv').setInnerFBML(response);
}
var postUrl = '<?php echo CALLBACK_URL ?>';
postUrl += '/services/ajax.php?action=get_content_to_load_into_div';
ajax.post(postUrl);
</script>
<div id="myDiv"></div>

Resources