¡Ayúdanos a traducir esta Web!
English | Castellano

Cómo usar el FileUpload AJAX

Custom Javascript 2

Sólo nuestra imaginación puede limitar las aplicaciones que le podemos dar al CustomJavascript. Lo más típico y solicitado es el mostrar una respuesta personalizada al usuario cuando nuestro fichero ha sido subido (PostUpload).

Recordemos que tanto en el evento PostUpLoad como en el evento PreDelete, podemos acceder a la información de fichero (HttpPostedFileAJAX), cuyo nombre de variables es el mismo que el de las propiedades del HttpPostedFileAJAX (el ejemplo es mucho más aclarador).

En nuestro ejemplo, cuando subimos una imagen mostramos toda la info de que disponemos sobre el fichero además de mostrar la propia imagen en el típico tag <img />... un ejemplo vale más que mil palabras:


Add



Code.aspx
<cc1:FileUploaderAJAX ID="FileUploaderAJAX1" runat="server" MaxFiles="1" />
<div id="info" style="overflow:auto"></div>
Code.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
   if (!Page.IsPostBack)
   {
       FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postUpload, postUploadJS());
       FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postDelete, clearDiv());
       FileUploaderAJAX1.addCustomJS(FileUploaderAJAX.customJSevent.postHide, clearDiv());
   }

   if (FileUploaderAJAX1.IsPosting)
       this.managePost();
}

private void managePost()
{
   HttpPostedFileAJAX pf = FileUploaderAJAX1.PostedFile;

   if (pf.Type == HttpPostedFileAJAX.fileType.image && pf.ContentLength <= 5 * 1024)
   FileUploaderAJAX1.SaveAs("~/temp", pf.FileName);
}

private string postUploadJS()
{
   StringBuilder sb = new StringBuilder();

   sb.Append("var info = parent.document.getElementById('info');");
   sb.Append("var message = '<b>FileName</b> = ' + FileName;");
   sb.Append("message += '<br /><b>FileName_SavedAs</b> = ' + FileName_SavedAs;");
   sb.Append("message += '<br /><b>FileName_Path</b> = ' + FileName_Path;");
   sb.Append("message += '<br /><b>ContentType</b> = ' + ContentType;");
   sb.Append("message += '<br /><b>Type</b> = ' + Type;");
   sb.Append("message += '<br /><b>ContentLength</b> = ' + ContentLength;");
   sb.Append("message += '<br /><b>responseMessage_Uploaded</b> = ' + responseMessage_Uploaded;");
   sb.Append("message += '<br /><b>responseMessage_Uploaded_Saved</b> = ' + responseMessage_Uploaded_Saved;");
   sb.Append("message += '<br /><b>responseMessage_Uploaded_NotSaved</b> = ' + responseMessage_Uploaded_NotSaved;");
   sb.Append("message += '<br /><b>Saved</b> = ' + Saved;");
   sb.Append("message += '<br /><b>Deleted</b> = ' + Deleted;");

   sb.Append(@"
       if (Type == 'image')
       {
          message += '<br/>';
          message += '<img src=""'+FileName_Path+'""/>';
       }
    ");

   sb.Append("info.innerHTML = message;");

   return sb.ToString();
}

private string clearDiv()
{
   StringBuilder sb = new StringBuilder();

   sb.Append("var info = parent.document.getElementById('info');");
   sb.Append("info.innerHTML = '';");

    return sb.ToString();
}