load content inside iframe using ajax

Question

hi folks

I have iframe that works at the server side :

<iframe frameborder="0" runat="server" style="width: 100%; height: 700px; background-color: #bacad3;" id="I1" name="I1" src="Page.aspx"></iframe>

and I change the content dynamically with this code :

protected void Button1_Click(object sender, EventArgs e)
{       
   I1.Attributes["src"] = "Page.aspx";
}

I want to implement it with ajax in the following way:

1. when user click out side of iframe dont postback page and change the src of iframe
2. I want to show the progress inside the progressupdatepanel

I mention it I dont want to run any postback just loading page inside the iframe with ajax by calling outside of iframe for example there is a button in the page and it is handled by update panel and it loads the content of other page inside the iframe. Could anybody help me ?

Answer 1

With onClientClick and mmke sure you return false to cancel the postback.

window.frames["frameName"].src = "http://example.com";
//or
document.getElementById("iframeId").src = "http://example.com";

If you are using runat=server you may need to use the client id

document.getElementById("<%= iframeId.ClientID %>").src = "http://example.com";

Answer 2

I found out it is not possible using this method you can not remove postback it needs proxing method like google mail (gmail) when you click inbox it apears in the right without postback but we can not implement with this method.