2017-04-26 28 views
0

マイページModalPopupExtender内に含まれるのUpdatePanel内IFRAMEにユーザ入力を別のASPXページをロードして第2の呼上のUpdatePanel内のiframeをリロードしないであろう。これは問題なく動作しますが、何らかの理由で[OK]ボタン(iframe内)を押してからModalPopupExtenderを閉じた後、適切なコールバックを行うことができるように、GetPostBackEventReferenceを使用してbtnOK asp:ボタンを登録しようとしました(たとえば、ユーザーがのは、つまり、この場合で複数のアクティビティを入力するのと同じ種類の別の入力を行いたい場合)はiframeを再開することができ。起こる問題はModalPopupExtenderの影が表示されていることですが、IFRAMEは、完全にその中にロードすることはありません。ModalPopupExtenderは

GetPostBackEventReferenceの代わりに__doPostBack('<%=btnOK .ClientID%>','OnClick');を使用すると、2番目の呼び出しを行うことができますが、ボタンのC#イベントハンドラは発生しません。むしろポストバックのみを取得します。私は完全なポストバックを取得するので、私は推測している、何かがページをリセットし、すべてはやり直します。

私はこの問題を解決することができますどのように任意のアイデア?

私がやろうとしていることの背景を少し説明してください。ページを小さくし、入力を出力から分離するために、他のページをiframeとModalPopupExtendersに読み込むとき、ページはユーザーにコンテンツを表示することになっています。これを念頭に置いて、私は流れを制御し、必要なときに適切なコールバックを行うことができるようにする必要があります。 ModalPopupExtenderを含む

コード:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %> 
<asp:Content ID="Content1" ContentPlaceHolderID="head_Obudget" runat="server"> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.CssClass_btnNewActivity').click(function() { 
      $('#frameInsertActivity').attr('src', 'InputForms/InsertActivity.aspx'); 
     }); 
    }); 
    function InsertActivity_Done() { 
     <%= Page.ClientScript.GetPostBackEventReference(btnOK, String.Empty) %>; 
    } 
</script> 
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder_Obudget" runat="server"> 
<asp:UpdatePanel ID="upNewActivity" runat="server" UpdateMode="Conditional"> 
    <Triggers> 
     <asp:PostBackTrigger ControlID="btnOK" /> 
    </Triggers> 
    <ContentTemplate> 
     <ajaxToolkit:ModalPopupExtender 
      BackgroundCssClass="ModalPopupBG" 
      ID="mpeNewActivity" 
      runat="server" 
      PopupControlID="divNewActivity" 
      TargetControlID="btnNewActivity" 
      OkControlID="btnOK" 
      CancelControlID="btnCancel" 
      DropShadow="true"> 
     </ajaxToolkit:ModalPopupExtender> 
     <asp:button id="btnNewActivity" runat="server" CssClass="CssClass_btnNewActivity" text="New Activity" /> 
     <div id="divNewActivity"> 
      <iframe id="frameInsertActivity" width="500" height="100" frameBorder="0"> 
      </iframe> 
     </div> 
     <div class="popup_Buttons"style="display: none;"> 
      <asp:Button ID="btnOK" runat="server" OnClick="btnOK_Click" OnClientClick="InsertActivity_Done();" CssClass="CSS_Class_btnOK" /> 
      <input id="btnCancel" type="button" value="Cancel" /> 
     </div> 
    </ContentTemplate> 
</asp:UpdatePanel> 
</asp:Content> 

コードはiframe用:

<asp:Content ID="Content1" ContentPlaceHolderID="head_Empty" runat="server"> 
<style type="text/css"> 
    body{background:white;} 
</style> 
<script type="text/javascript"> 
    function okay() { 
     $(window.parent.document).find('.CSS_Class_btnOK').click(); 
    } 
    function cancel() { 
     window.parent.document.getElementById('btnCancel').click(); 
    } 
</script> 
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder_Empty" runat="server"> 
<table> 
    <tr> 
     <th colspan="2"> 
      New Activity: 
     </th> 
    </tr> 
    <tr> 
     <td> 
      Name: <asp:TextBox ID="tbNewActivityName" runat="server" Width="200"></asp:TextBox> 
      <asp:RequiredFieldValidator ID="rfvNewActivityName" runat="server" ControlToValidate="tbNewActivityName" ValidationGroup="VG_NewActivity" ErrorMessage="*" Display="Dynamic"></asp:RequiredFieldValidator> 
     </td> 
     <td> 
      <div class="popup_Buttons"> 
       <asp:Button ID="btnInsertNewActivity" runat="server" Text="Add" OnClick="btnInsertNewActivity_Click" ValidationGroup="VG_NewActivity" /> 
       <input id="btnCancel" onclick="cancel();" type="button" value="Cancel" /> 
      </div> 
     </td> 
    </tr> 
</table> 
</asp:Content> 

答えて

0

私は、問題が何であったか実現:ModalPopupExtenderを開くボタンは、また、クリックイベントでのjQueryを実行iframeの 'src'属性を配線します。

は私が私がIFRAMEの最初の実行

から戻った後にこのボタンを再び見つけることができるように、子孫要素からのイベントを処理するために委任イベントハンドラを使用する必要があります...コードは今見て、次のように動作します:

$(document).on('click', '.CssClass_btnNewActivity', function() { 
      $('#frameInsertActivity').attr('src', 'InputForms/InsertActivity.aspx'); 
     }); 

...これとは反対に、動作しませんでした:

$('.CssClass_btnNewActivity').click(function() { 
     $('#frameInsertActivity').attr('src', 'InputForms/InsertActivity.aspx'); 
    }); 

...私はいつもこれを忘れる=]

関連する問題