Developer's Diary

12 diciembre, 2010

ASP.Net FileUpload y Ajax Un problema, varias soluciones

Filed under: .net, Curso C#, Internet, Programación, Tips — Etiquetas: , , , , — jnavero @ 2:10 AM

—- Nos mudamos: http://devthisblog.namocode.es
—————————————————————–
He escrito este Tip, debido a que me he encontrado con que el FileUpload no funciona con Ajax y a la hora de buscar una solución no la he encontrado nada más que en un blog en ingles (en mi caso era el problema descrito en la última parte del documento).  Aunque existen cientos de sitios hablando del FileUpload y Ajax. Paso a explicar un poco por encima el problema y las soluciones.

Este fallo es debido a que en el momento que ponemos el control Ajax el FileUpload de “descuajaringa”, no puede enviar ficheros de forma asíncrona (en otros sitios he leído que cuando se hace un doble postback en la pagina tampoco funciona por seguridad para evitar subir código malicioso).

Una solución a este problema, nos lo dan en la web: http://fileuploadajax.subgurim.net/ con un componente Ajax. Se trata de una DLL muy sencilla de utilizar

Basta con agregar la referencia en el proyecto, botón derecho sobre el proyecto

Y pulsamos sobre agregar referencia. Posteriormente, seleccionamos la referencia

 

Después, añadimos el ensamblado siguiente en la web donde vamos a utilizar el control,

<%@ Register Assembly=”FUA” Namespace=”Subgurim.Controles” TagPrefix=”cc1″ %>

Y por último, añadimos el control en la web con la siguiente línea:

<cc1:FileUploaderAJAX ID=”FileUploaderAJAX1″ runat=”server” />

De esta forma, podemos usar el control en C# o VB a nuestro gusto.

Otra forma de solventar este problema es mediante la utilización de triggers en Ajax. Estos triggers  se utilizan para hacer un postback junto con la pulsación del botón (o evento) al que le asignemos dicho trigger, un ejemplo de esto sería el siguiente:

<asp:UpdatePanel>
  <ContentTemplate>
<asp:Button ID="BotonUpload" runat="server" Text="Upload" />
</ContentTemplate>
  <Triggers>
<asp:PostBackTrigger ControlID=" BotonUpload " />
  </Triggers>
</asp:UpdatePanel>

Mientras el lado del código, funciona como siempre.

Leyendo otros Post he visto que podría existir otro problema, se trata del siguiente:

Si el FileUpload está oculto o no se carga en la página inicial pero aparece después tras una actualización asíncrona de la página o de alguna parte de ella, tampoco funcionará. El problema es debido a que por lo general, se establece el método OnPreRender como anulado.

La solución, es la siguiente:

En la página web (fichero aspx)

<asp:UpdatePanel>
  <ContentTemplate>
      <asp:FileUpload ID="UptxtImg2" runat="server" Width="30em" Visible="false"    
                      OnPreRender="OnPreRender" />
      <asp:Button ID="BotonUpload" runat="server" Text="Upload" OnClick="BotonUpload "/>
   </ContentTemplate>
   <Triggers>
      <asp:PostBackTrigger ControlID="BotonUpload" />
   </Triggers>
</asp:UpdatePanel>

Aquí se mostraría el FileUpload, un botón y el trigger Ajax con el botón. Por otro lado la parte del código quedaría de la siguiente forma:

protected void OnPreRender(object sender, EventArgs e)

{

base.OnPreRender(e);

if ((this.Page.Form != null) && (this.Page.Form.Enctype.Length == 0))

{

this.Page.Form.Enctype = “multipart/form-data”;

}

}

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

this.Page.Form.Enctype = “multipart/form-data”;

}

protected void  BotonUpload(object sender, EventArgs e)

{

if (this.UptxtImg2.HasFile)

{

//aquí tratamos el FileUpload…

}

}

Hasta aquí el Tip de ASP y Ajax, espero haber sido de ayuda.

Nota: Lo anteriormente expuesto, ha sido una recopilación de varios blogs así como consultas de varias webs como las siguientes:

http://marss.co.ua/FileUploadAndUpdatePanel.aspx

http://mobiledeveloper.wordpress.com/2007/05/15/file-upload-with-aspnet-ajax-updatepanel/

http://fileuploadajax.subgurim.net/

Anuncios

2 comentarios »

  1. Muchisimas gracias.
    Hasta que he dado con tu página 🙂
    Funciona perfecto.
    1 saludo

    Comentario por Antonio — 30 marzo, 2016 @ 11:31 AM

    • De nada!

      Me alegro que te haya servido.

      Comentario por jnavero — 7 abril, 2016 @ 7:02 PM


RSS feed for comments on this post. TrackBack URI

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: