панель обновления не работает для iframe, почему? - PullRequest
Новая
       8

панель обновления не работает для iframe, почему?

0 голосов
/ 31 января 2011

Примечание

  • Пожалуйста, предоставьте решение проблемы. thnku
  • должен достичь функциональности типа ajax для элементов управления страницей, отображаемой в iframe, пожалуйста, предложите какое-нибудь лекарство любое лекарство.

содержимое (кнопка) внутри iframe вызывает полный пост обратно

  • Я использовал панель обновления, диспетчер скриптов на главной странице
  • , а также на pae, отображаемом в iframe

даже тогда пост-ответ происходит

примечание

Я проверяю это, используя текущее время дня на этикетке.

вот коды.

default.aspx 

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css">  </link>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>

        <table style="width: 100%;" align="center" width="100%">
            <tr>
                <td align="center" valign="top" bgcolor="#FFFF99" nowrap="nowrap" width="100%" 
                    style="width: 100%;" colspan="2">
                    Logo and pic here 
                    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
                </td>
            </tr>
            <tr>
                <td align="left" nowrap="nowrap" style="width: 20%;" valign="top" width="20%"  bgcolor="#CC00CC">
                    Side Left

                    <br />
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                        <asp:Label runat="server" Text="Menu will come here"></asp:Label>
      <br />
                            <asp:Button ID="Button1" runat="server" Text="small" 
                                onclick="size_iframe_small" />
                            <asp:Button ID="Button2" runat="server" Text="big" onclick="size_iframe_big" />


                            <br />
                            <!--Source HTML codes by Quackit.com 
                            http://www.quackit.com/html/codes/scrolling_images.cfm
                            -->

<marquee behavior="scroll" direction="up" scrollamount="5" onmouseover="this.setAttribute('scrollamount', 2, 0);" onmouseout="this.setAttribute('scrollamount', 5, 0);"  >
<div>
<asp:Image ID="Image1" runat="server" Height="100px" 
                                ImageUrl="~/Images/Water lilies.jpg" Width="100%" ></asp:Image>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="Page0004.aspx" Target="I1" CssClass="hyperlink_marquee" BackColor="#FFFF99">PAGE0004</asp:HyperLink>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

</div>

</marquee>


      </ContentTemplate>
                    </asp:UpdatePanel>

                    <div>
                    This DOESNOT have AJAX, 
                    <br />
                    notice the postback
                    <br />
                        <asp:Button ID="Button3" runat="server" Text="POSTBACK" />
                    </div>

                </td>
                <td align="left" bgcolor="#006600" nowrap="nowrap" style="width: 80%;" valign="top" width="80%">
                    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                        <ContentTemplate>

                   Content Center <br />
                    <asp:Panel ID="Panel1" runat="server" >
                    below is a iframe
                    <br />
                    frame border is one to display effect.                    
                    </asp:Panel>
                            <iframe id="I1" runat="server" name="I1" scrolling="no" ></iframe>
                        </ContentTemplate>
                    </asp:UpdatePanel>


                </td>
            </tr>
             <tr>
                <td align="center" bgcolor="#FF99CC" nowrap="nowrap" style="width: 100%;" 
                     valign="bottom" width="100%" colspan="2">
                   copyright pic
                </td>
            </tr>
            <tr>
                <td align="center" bgcolor="Aqua" nowrap="nowrap" style="width: 100%;" 
                    valign="bottom" width="100%" colspan="2">
                   bottom links
                </td>
            </tr>
        </table>
    </div>



    </form>
</body>
</html>

источник страницы 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>

</title><link href="StyleSheet.css" rel="stylesheet" type="text/css" />  </link>
</head>
<body>
    <form name="form1" method="post" action="Default.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTMxNjQzNjAzOA9kFgICAw9kFgQCAw8PFgIeBFRleHQFEDAwOjA1OjIwLjE0MDYyNTBkZAIJD2QWAmYPZBYCAgMPFgQeBkhlaWdodAUGMTAwMHB4HgVXaWR0aAUFNzAwcHhkZIj8iyoBcGPp9uYNf6JDGALbcNPc" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<script src="/WebSite2/WebResource.axd?d=SaMSNOBLKccV2NOTlN-gpw2&amp;t=634143971188437500" type="text/javascript"></script>


<script src="/WebSite2/ScriptResource.axd?d=wSIzE9Mm7k9OISEyoWDsv3U4aXp9CFd2A4oFHH6FT1g6BCLjteDUaab2pkPnDwBpBV94ozt6kAUQ8M2GCuP8p7K6gO-LkSKrRL_6Fka6BBY1&amp;t=ffffffffc9e9457d" type="text/javascript"></script>
<script src="/WebSite2/ScriptResource.axd?d=wSIzE9Mm7k9OISEyoWDsv3U4aXp9CFd2A4oFHH6FT1g6BCLjteDUaab2pkPnDwBpwApHifEXkw8RNjLgUqr8FJOGxAzU11m_nYTGH6QqtL81&amp;t=ffffffffc9e9457d" type="text/javascript"></script>
<div>

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBQLe247BDgKM54rGBgK7q7GGCALs0bLrBgLWlM+bAg8dLO2f49U7Nx0cS1fOwVELnlid" />

</div>
    <div>
        <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ScriptManager1', document.getElementById('form1'));
Sys.WebForms.PageRequestManager.getInstance()._updateControls(['tUpdatePanel1','tUpdatePanel2'], [], [], 90);
//]]>
</script>


        <table style="width: 100%;" align="center" width="100%">
            <tr>
                <td align="center" valign="top" bgcolor="#FFFF99" nowrap="nowrap" width="100%" 
                    style="width: 100%;" colspan="2">
                    Logo and pic here 
                    <span id="Label1">00:05:20.1406250</span>

                </td>
            </tr>
            <tr>
                <td align="left" nowrap="nowrap" style="width: 20%;" valign="top" width="20%"  bgcolor="#CC00CC">
                    Side Left

                    <br />
                    <div id="UpdatePanel1">

                        <span>Menu will come here</span>
      <br />

                            <input type="submit" name="Button1" value="small" id="Button1" />
                            <input type="submit" name="Button2" value="big" id="Button2" />




                            <br />
                            <!--Source HTML codes by Quackit.com 
                            http://www.quackit.com/html/codes/scrolling_images.cfm
                            -->

<marquee behavior="scroll" direction="up" scrollamount="5" onmouseover="this.setAttribute('scrollamount', 2, 0);" onmouseout="this.setAttribute('scrollamount', 5, 0);"  >
<div>
<img id="Image1" src="Images/Water%20lilies.jpg" style="height:100px;width:100%;border-width:0px;" />
<a id="HyperLink1" class="hyperlink_marquee" href="Page0004.aspx" target="I1" style="background-color:#FFFF99;">PAGE0004</a>
<input name="TextBox1" type="text" id="TextBox1" />

</div>

</marquee>



</div>

                    <div>
                    This DOESNOT have AJAX, 
                    <br />
                    notice the postback
                    <br />
                        <input type="submit" name="Button3" value="POSTBACK" id="Button3" />
                    </div>


                </td>
                <td align="left" bgcolor="#006600" nowrap="nowrap" style="width: 80%;" valign="top" width="80%">
                    <div id="UpdatePanel2">


                   Content Center <br />
                    <div id="Panel1">

                    below is a iframe
                    <br />
                    frame border is one to display effect.                    

    </div>

                            <iframe id="I1" name="I1" scrolling="no" Height="1000px" Width="700px"></iframe>

</div>


                </td>
            </tr>
             <tr>
                <td align="center" bgcolor="#FF99CC" nowrap="nowrap" style="width: 100%;" 
                     valign="bottom" width="100%" colspan="2">
                   copyright pic
                </td>
            </tr>

            <tr>
                <td align="center" bgcolor="Aqua" nowrap="nowrap" style="width: 100%;" 
                    valign="bottom" width="100%" colspan="2">
                   bottom links
                </td>
            </tr>
        </table>
    </div>





<script type="text/javascript">
//<![CDATA[
Sys.Application.initialize();
//]]>
</script>
</form>

</body>
</html>

page0004.aspx 

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Page0004.aspx.cs" Inherits="Page0004" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Page0004</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>

        <asp:UpdatePanel ID="UpdatePanel199" runat="server">
        <ContentTemplate>

            <asp:Button ID="Button1" runat="server" Text="No Postback" />

        <br />
        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
        </ContentTemplate>
        </asp:UpdatePanel>



    </div>
    </form>
</body>
</html>

Ответы [ 2 ]

3 голосов
/ 31 января 2011

На панели обновления должны быть определены триггеры, чтобы она знала, какие события для каких элементов управления захватывать.Из-за этого элементы управления, для которых вы регистрируете события, должны быть видимы для UpdatePanel и, следовательно, не могут находиться в пределах iframe.

РЕДАКТИРОВАТЬ:

Триггеры могут быть определены следующим образом: 

<asp:UpdatePanel>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
    </Triggers>
    <ContentTemplate>
        <!-- Your content here -->
    </ContentTemplate>
</asp:UpdatePanel>

Подробнее о том, как можно UpdatePanel найти работу здесь .

Однако, как я уже сказал, Button1 должен быть определен в пределах области UpdatePanel, которая знает об этом.Следовательно, если вы хотите изменить элемент управления на default.aspx в обработчике событий Button1_Click, тогда Button1 и элемент управления, который нужно изменить, должны быть видны друг другу (и, следовательно, не определены в iframe).Возможно, вы сможете сделать то, что вы хотите, заменив свой iframe пользовательским элементом управления, который содержит содержимое page0004, но вы были бы уверены, что все элементы управления между default.aspx и пользовательским элементом управления всегда будут там.

Есть ли причина, по которой вы указали page0004 отдельно и внедряете его в iframe?

2 голосов
/ 01 февраля 2011

немного не понятно, что вы хотите сделать, но вот ваше решение 

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="test2.aspx.vb" Inherits="test2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:ScriptManager runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="one" runat="server">
        <ContentTemplate>
            <asp:Label runat="server">I want to be changed</asp:Label>
            <iframe src="test3.aspx"></iframe>
        </ContentTemplate>
    </asp:UpdatePanel>
    </div>
    </form>
</body>
</html>

Внутри страницы "test3.aspx" вы вставляете следующее 

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="test2.aspx.vb" Inherits="test2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        Im an Iframe
        <asp:Button OnClientClick="parent.Sys.WebForms.PageRequestManager.getInstance()._doPostBack('one', '')" runat="server" />
    </div>
    </form>
</body>
</html>

Теперь вы видите функцию parent.Sys.WebForms.PageRequestManager.getInstance()._doPostBack('one', '') parent используется для выхода из iframe, теперь вы находитесь на главной странице

Sys.WebForms.PageRequestManager.getInstance()._doPostBack вызывает обратную передачу панели обновления, если первый аргумент является идентификатором запрошенной панели обновления ...

...