ModalPopupExtender pagination gridview ne fonctionne pas

Question

radiomessagerie GridView en cause de ModalPopupExtender : J'ai un GridView dans ModalPopupExtender ... mais la chose est Paging ne fonctionne pas à l'intérieur ....

Mon code HTML est:

<asp:UpdatePanel ID="UpdatePanel2" runat="server"> 
<ContentTemplate> 
<asp:gridview runat="server" id="GridView2" showfooter="true" 
    autogeneratecolumns="false" GridLines="None" CssClass="table" 
    HeaderStyle-CssClass="th" RowStyle-CssClass="td" Width="100%" 
    OnRowCreated="GridView2_RowCreated" > 
    <columns> 

     <asp:TemplateField HeaderText="Date" > 
<ItemTemplate> 
<asp:LinkButton ID="Date" runat="server" CausesValidation="false" CommandName="Date_Select" Text='<%#Eval("Date","{0:yyyy-MM-dd}") %>' onclick="Date1_Click" EnableTheming="False"></asp:LinkButton> 


</ItemTemplate> 
<EditItemTemplate> 

</EditItemTemplate> 
</asp:TemplateField> 


     <asp:boundfield datafield="" headertext="Total" footerstyle-font-bold="true" 
      footertext="Grand Total:" > 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 

     <asp:boundfield datafield="MIns" headertext="Mins" 
      footerstyle-font-bold="true" > 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 
     <asp:boundfield datafield="Amount" headertext="Amount" footerstyle-font-bold="true" 
      > 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 

     <asp:boundfield datafield="Profit" headertext="Profit" 
      footerstyle-font-bold="true"> 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 

    </columns> 

<HeaderStyle BackColor="#CEFF99" ForeColor="Black" BorderColor="#C1FF80" BorderStyle="Solid" 
       BorderWidth="1px"></HeaderStyle> 

<RowStyle CssClass="td"></RowStyle> 
</asp:gridview> 


<asp:Button runat="server" ID="btnModalPopUp1" 
     style="display:none"/> 


<AjaxToolkit:ModalPopupExtender ID="modalPopUpExtender2" 
     runat="server" 
     TargetControlID="btnModalPopUp1" 
     PopupControlID="pnlPopUp1" 
     BackgroundCssClass="modalBackground" CancelControlID="btnCancel1" X="570" Y="10" 
     > 
</AjaxToolkit:ModalPopupExtender> 
      <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2"> 
    <ProgressTemplate> 
     <div class="modal"> 
     <div class="center" align="center"> 
      This can take a while. Please be patient... 
      <img alt="" src="Images/loader.gif" /> 
     </div> 
     </div> 
     </ProgressTemplate> 
    </asp:UpdateProgress> 


<asp:Panel runat="Server" ID="pnlPopUp1" CssClass="modalPopup"> 
<asp:Button runat="server" ID="btnCancel1" 
     Text="Close"/> 
<asp:gridview runat="server" id="GridView18" showfooter="true" 
    autogeneratecolumns="false" GridLines="None" CssClass="table" 
    HeaderStyle-CssClass="th" RowStyle-CssClass="td" Width="100%" 
    AllowPaging="True" OnPageIndexChanging="OnPageIndexChanging" PageSize="10" 
    EnableSortingAndPagingCallbacks="True" > 
    <columns> 

     <asp:boundfield datafield="Customer" headertext="Customer" 
      footerstyle-font-bold="true" > 
    <FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 


     <asp:boundfield datafield="MIns" headertext="Mins" footerstyle-font-bold="true" > 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 
     <asp:boundfield datafield="Amount" headertext="Amount" 
      footerstyle-font-bold="true" > 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 
     <asp:boundfield datafield="Profit" headertext="Profit" footerstyle-font-bold="true" 
      > 
<FooterStyle Font-Bold="True"></FooterStyle> 
     </asp:boundfield> 



    </columns> 

<HeaderStyle BackColor="#CEFF99" ForeColor="Black" BorderColor="#C1FF80" BorderStyle="Solid" 
       BorderWidth="1px"></HeaderStyle> 

    <RowStyle CssClass="td"></RowStyle> 
</asp:gridview> 
</asp:Panel> 



</ContentTemplate> 
<Triggers> 
<asp:AsyncPostBackTrigger ControlID = "GridView18" EventName="PageIndexChanging" /> 

    </Triggers> 
    </asp:UpdatePanel> 

Ceci est mon code derrière pour Paging:

protected void OnPageIndexChanging(object sender, GridViewPageEventArgs e) 
{ 
    GridView18.DataSource = ds; 
    GridView18.PageIndex = e.NewPageIndex; 
    GridView18.DataBind(); 
    modalPopUpExtender2.Show(); 

    } 

Toute aide est très appréciée ... Merci à l'avance ...

Answer 1

Première: si vous allez à MSDN concerning UpdatePanels et faites défiler jusqu'à la section:

contrôles qui sont non Compatible avec UpdatePanel Controls

Vous trouverez ceci:

• Contrôles GridView et DetailsView lorsque leur propriété EnableSortingAndPagingCallbacks est définie sur true.

La pagination d'une Gridview nécessite une publication. Généralement, lorsque vous utilisez n'importe quel type de contrôle modal/popup, il utilise JS pour l'activer. Mais un postback va éliminer le popup ... alors ...

L'essentiel est que vous soyez capable de maintenir l'état de la popup entre les postbacks. Il y a plusieurs façons de gérer cela.

Le plus simple est d'éliminer la pagination et d'utiliser le défilement, en supposant que le nombre total d'éléments est une liste gérable. Si la liste est trop longue il y a de fortes chances que ce soit aussi trop d'informations pour un utilisateur et qu'il devrait être filtré dans une liste gérable.

Si vous devez utiliser la pagination, vous devez utiliser un contrôle contextuel qui peut supporter les publications, ce qui peut nécessiter l'utilisation d'un . Je ne sais pas assez sur le AjaxControlToolkit pour dire si cela peut être fait de cette façon.

Personnellement, quand j'avais besoin de faire ce que vous essayez de faire via popup, j'utilise Colorbox. Mais cela nécessite également jquery.

Je déplace le gridview vers une page autonome et configure Colorbox pour ouvrir la page dans un iframe. De cette façon, iframe gère les publications de pagination.