如何在运行时动态地在另一个ASPX的DIV中显示ASPX?

时间:2022-12-15 13:21:21

Here is what I am trying to do in ASP.NET:

这是我在ASP.NET中尝试做的事情:

Create one page called Main.aspx. This page has a DIV and a buttons.

创建一个名为Main.aspx的页面。此页面有一个DIV和一个按钮。

The browser loads Main.aspx. Then when I click the button, I want to load page Page99.aspx into the DIV in Main.aspx dynamically, but without Main.aspx requiring a postback.

浏览器加载Main.aspx。然后当我单击按钮时,我想动态地将页面Page99.aspx加载到Main.aspx中的DIV中,但是没有Main.aspx需要回发。

So, Main.aspx loads once, and thereafter all the content displayed in Main.aspx will come from different .aspx pages.

因此,Main.aspx加载一次,此后Main.aspx中显示的所有内容将来自不同的.aspx页面。

Ps. I'm looking for a solution as above, but not using frames.

PS。我正在寻找上面的解决方案,但不使用框架。

UPDATE 1 I should mention that Page99 is not a simple HTML page. It will contain Web controls.

更新1我应该提到Page99不是一个简单的HTML页面。它将包含Web控件。

5 个解决方案

#1


4  

As far as I know, barring the use of iframes, there is no way to load one aspx page into another.

据我所知,除非使用iframe,否则无法将一个aspx页面加载到另一个页面中。

With postbacks or ajax, you can use UserControls (ascx) instead. They can contain pretty much the same content a page can anyway, or use a MasterPage.

使用回发或ajax,您可以使用UserControls(ascx)。它们可以包含几乎相同的页面内容,或者使用MasterPage。

If you wish to have no postbacks, ajax is probably the way to go, though again, it does not allow you to load an aspx page into another, only to change the content of the page you're on (amongst other things).

如果你希望没有回发,ajax可能是要走的路,尽管如此,它不允许你将aspx页面加载到另一个页面,只是为了改变你所在页面的内容(除其他外)。

I'm not sure about other platforms for web development though, they may have a solution closer to what you want to do, so if asp.net is not a "must", you should consider checking out other platforms.

我不确定其他用于Web开发的平台,他们可能有一个更接近你想做的解决方案,所以如果asp.net不是“必须”,你应该考虑检查其他平台。

#2


6  

If you don't want to use the iFrames, you can very well use Object element of HTML. Follow here to see and html example. You can very well use this for aspx also with some change, like using OnClientClick property for aspx button etc.

如果您不想使用iFrame,您可以很好地使用HTML的Object元素。按照这里查看和html示例。你可以很好地使用它来为aspx做一些改变,比如使用OnClientClick属性来获取aspx按钮等。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>mouseover image position</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<style type="text/css">
/*<![CDATA[*/
body
   {
    background-color:#aaaaff;
   }
#one
   {
    position:absolute;
    left:50%;
    top:50%;
    margin:-150px 0 0 -250px;
   }
object
   {
    width:500px; 
    height:300px; 
    border:solid 1px #000000;
   }
 /*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[
// written by: Coothead
function updateObjectIframe(which){
    document.getElementById('one').innerHTML = '<'+'object id="foo" name="foo" type="text/html" data="'+which.href+'"><\/object>';
}

//]]>
</script>

</head>
<body>

<div id="one">
<object id="foo" name="foo" type="text/html" data="http://www.w3schools.com/"></object>
</div>
<div>
<a href="http://www.google.com" onclick="updateObjectIframe(this); return false;">this is an object test not an iframe test</a>
</div>

</body>
</html>

#3


1  

If you're using the AJAX toolkit it should be possible to do this using a webcontrol rather than an ASPX page.

如果您正在使用AJAX工具包,则可以使用webcontrol而不是ASPX页面来执行此操作。

If you try to pursue this idea using ASPX pages, and without using an iframe, you will find that there is no isolation provided for javascript variable names and element ids, therefore almost guaranteeing conflicts if you put the rendered aspx's content into a div using innerHTML; The page will definitely not be able to perform a partial postback as I imagine you would like.

如果你试图使用ASPX页面来实现这个想法,而不使用iframe,你会发现没有为javascript变量名和元素id提供隔离,因此如果你使用innerHTML将渲染的aspx内容放入div中,几乎可以保证冲突;该页面肯定无法像我想象的那样执行部分回发。

Using a webcontrol instead: A better solution would be to install the AJAX toolkit if you haven't already, and use an updatepanel control. Either dynamically load and unload webcontrols inside this panel (using LoadControl()), or place a Multiview control inside it and change the activeview to simulate changing this content.

使用webcontrol:更好的解决方案是安装AJAX工具包(如果尚未安装),并使用updatepanel控件。在此面板中动态加载和卸载webcontrol(使用LoadControl()),或在其中放置Multiview控件并更改activeview以模拟更改此内容。

The updatepanel will allow its contents to update without a full postback (page refresh).

updatepanel将允许其内容在没有完整回发(页面刷新)的情况下进行更新。

#4


0  

Maybe I'm missing something. But you can use UFrame in this case.

也许我错过了一些东西。但是在这种情况下你可以使用UFrame。

http://msmvps.com/blogs/omar/archive/2008/05/24/uframe-goodness-of-updatepanel-and-iframe-combined.aspx

http://msmvps.com/blogs/omar/archive/2008/05/24/uframe-goodness-of-updatepanel-and-iframe-combined.aspx

#5


0  

I would think that you could do this using AJAX and a web method on the server.

我认为你可以使用AJAX和服务器上的Web方法来做到这一点。

The button(s) on the page calls the web method using AJAX, with various arguments for the correct page to load into the DIV. The web method loads the correct page using a normal web request.

页面上的按钮使用AJAX调用Web方法,并使用各种参数将正确的页面加载到DIV中。 Web方法使用普通Web请求加载正确的页面。

Eg:

例如:

HttpWebRequest request = (HttpWebRequest)WebRequest.Create("http://servername/filename.aspx");
WebResponse response = request.GetResponse();

Then the method would return the HTML generated by the ASPX file back to the client. When the client gets the callback, it can un-encode the HTML and put it into the div.

然后该方法将ASPX文件生成的HTML返回给客户端。当客户端获得回调时,它可以解码HTML并将其放入div中。

Eg:

例如:

var startOfHTML = response.indexOf('&lt;');
var endOfHTML = response.indexOf('</string>');

response = response.substring(startOfHTML, endOfHTML);
response = response.replace(/&lt;/g, "<");
response = response.replace(/&gt;/g, ">");

var div = document.getElementById("myDIV");
div.innerHTML = response;

#1


4  

As far as I know, barring the use of iframes, there is no way to load one aspx page into another.

据我所知,除非使用iframe,否则无法将一个aspx页面加载到另一个页面中。

With postbacks or ajax, you can use UserControls (ascx) instead. They can contain pretty much the same content a page can anyway, or use a MasterPage.

使用回发或ajax,您可以使用UserControls(ascx)。它们可以包含几乎相同的页面内容,或者使用MasterPage。

If you wish to have no postbacks, ajax is probably the way to go, though again, it does not allow you to load an aspx page into another, only to change the content of the page you're on (amongst other things).

如果你希望没有回发,ajax可能是要走的路,尽管如此,它不允许你将aspx页面加载到另一个页面,只是为了改变你所在页面的内容(除其他外)。

I'm not sure about other platforms for web development though, they may have a solution closer to what you want to do, so if asp.net is not a "must", you should consider checking out other platforms.

我不确定其他用于Web开发的平台,他们可能有一个更接近你想做的解决方案,所以如果asp.net不是“必须”,你应该考虑检查其他平台。

#2


6  

If you don't want to use the iFrames, you can very well use Object element of HTML. Follow here to see and html example. You can very well use this for aspx also with some change, like using OnClientClick property for aspx button etc.

如果您不想使用iFrame,您可以很好地使用HTML的Object元素。按照这里查看和html示例。你可以很好地使用它来为aspx做一些改变,比如使用OnClientClick属性来获取aspx按钮等。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>mouseover image position</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<style type="text/css">
/*<![CDATA[*/
body
   {
    background-color:#aaaaff;
   }
#one
   {
    position:absolute;
    left:50%;
    top:50%;
    margin:-150px 0 0 -250px;
   }
object
   {
    width:500px; 
    height:300px; 
    border:solid 1px #000000;
   }
 /*//]]>*/
</style>

<script type="text/javascript">
//<![CDATA[
// written by: Coothead
function updateObjectIframe(which){
    document.getElementById('one').innerHTML = '<'+'object id="foo" name="foo" type="text/html" data="'+which.href+'"><\/object>';
}

//]]>
</script>

</head>
<body>

<div id="one">
<object id="foo" name="foo" type="text/html" data="http://www.w3schools.com/"></object>
</div>
<div>
<a href="http://www.google.com" onclick="updateObjectIframe(this); return false;">this is an object test not an iframe test</a>
</div>

</body>
</html>

#3


1  

If you're using the AJAX toolkit it should be possible to do this using a webcontrol rather than an ASPX page.

如果您正在使用AJAX工具包,则可以使用webcontrol而不是ASPX页面来执行此操作。

If you try to pursue this idea using ASPX pages, and without using an iframe, you will find that there is no isolation provided for javascript variable names and element ids, therefore almost guaranteeing conflicts if you put the rendered aspx's content into a div using innerHTML; The page will definitely not be able to perform a partial postback as I imagine you would like.

如果你试图使用ASPX页面来实现这个想法,而不使用iframe,你会发现没有为javascript变量名和元素id提供隔离,因此如果你使用innerHTML将渲染的aspx内容放入div中,几乎可以保证冲突;该页面肯定无法像我想象的那样执行部分回发。

Using a webcontrol instead: A better solution would be to install the AJAX toolkit if you haven't already, and use an updatepanel control. Either dynamically load and unload webcontrols inside this panel (using LoadControl()), or place a Multiview control inside it and change the activeview to simulate changing this content.

使用webcontrol:更好的解决方案是安装AJAX工具包(如果尚未安装),并使用updatepanel控件。在此面板中动态加载和卸载webcontrol(使用LoadControl()),或在其中放置Multiview控件并更改activeview以模拟更改此内容。

The updatepanel will allow its contents to update without a full postback (page refresh).

updatepanel将允许其内容在没有完整回发(页面刷新)的情况下进行更新。

#4


0  

Maybe I'm missing something. But you can use UFrame in this case.

也许我错过了一些东西。但是在这种情况下你可以使用UFrame。

http://msmvps.com/blogs/omar/archive/2008/05/24/uframe-goodness-of-updatepanel-and-iframe-combined.aspx

http://msmvps.com/blogs/omar/archive/2008/05/24/uframe-goodness-of-updatepanel-and-iframe-combined.aspx

#5


0  

I would think that you could do this using AJAX and a web method on the server.

我认为你可以使用AJAX和服务器上的Web方法来做到这一点。

The button(s) on the page calls the web method using AJAX, with various arguments for the correct page to load into the DIV. The web method loads the correct page using a normal web request.

页面上的按钮使用AJAX调用Web方法,并使用各种参数将正确的页面加载到DIV中。 Web方法使用普通Web请求加载正确的页面。

Eg:

例如:

HttpWebRequest request = (HttpWebRequest)WebRequest.Create("http://servername/filename.aspx");
WebResponse response = request.GetResponse();

Then the method would return the HTML generated by the ASPX file back to the client. When the client gets the callback, it can un-encode the HTML and put it into the div.

然后该方法将ASPX文件生成的HTML返回给客户端。当客户端获得回调时,它可以解码HTML并将其放入div中。

Eg:

例如:

var startOfHTML = response.indexOf('&lt;');
var endOfHTML = response.indexOf('</string>');

response = response.substring(startOfHTML, endOfHTML);
response = response.replace(/&lt;/g, "<");
response = response.replace(/&gt;/g, ">");

var div = document.getElementById("myDIV");
div.innerHTML = response;