Muchos piensan que esto no es posible: subir archivos al servidor desde un ModalPopup , el cual está dentro de un UpdatePanel, pues sí es posible. Resumiendo, el código debe tener esta forma:
<UpdatePanel ChildrenAsTriggers="true">
<ContentTemplate>
<Panel>
FileUpload…+ El botón que subirá tu archivo y guardará tu información, mi botón se llama btnSave
Otros controles…
<Panel>
<ModalPopupExtender />
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnSave" />
</Triggers>
</UpdatePanel>
Y ese es el resumen. Como pueden observar, la novedad del updatepanel es que tiene la propiedad ChildrenAsTriggers=”true” y la otra novedad es que antes de que cierre el updatepanel, se ha añadido el tag triggers, como ven en la imagen muy claramente.
Vamos a ver el ejemplo mediante código, copien esto en una nueva página aspx:
<html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>Subir archivos desde el modalpopup dentro un Updatepanel</title> <style type="text/css"> * { font-family: Tahoma; } .modalPopup { background-color:orange; border-width:5px; border-style:solid; padding:3px; } .modalBackground { filter:alpha(opacity=50); opacity:0.7; } </style> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" ChildrenAsTriggers="true" runat="server"> <ContentTemplate> <asp:HyperLink ID="hplOpenModal" NavigateUrl="javascript:;" runat="server">Mostrar ModalPopup</asp:HyperLink> <asp:Panel ID="pnlFileAdd" runat="server" Style="display: none" CssClass="modalPopup" Height="100px" Width="300px"> <asp:FileUpload ID="FileUpload1" runat="server" /> <p> <asp:Button ID="btnSave" runat="server" Text="Subir archivo" /> <asp:Button ID="btnCancel" runat="server" Text="Cancelar" /> </p> </asp:Panel> <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="hplOpenModal" PopupControlID="pnlFileAdd" BackgroundCssClass="modalBackground" CancelControlID="btnCancel" Y="100" /> </ContentTemplate> <Triggers> <asp:PostBackTrigger ControlID="btnSave" /> </Triggers> </asp:UpdatePanel> </form> </body> </html>
Esto va en el código VB.NET:
Protected Sub btnSave_Click(sender As Object, e As EventArgs) Handles btnSave.Click If FileUpload1.HasFile Then FileUpload1.SaveAs(Server.MapPath("~/uploads/") & FileUpload1.FileName) End If End Sub
Se supone que en la raiz de la applicación hay una carpeta llamada Uploads, donde se guardará el archivo. Eso sería todo.
Espero que les sea de utilidad ;)
