Creando un File Upload

Posted by jaullo on Geeks with Blogs See other posts from Geeks with Blogs or by jaullo
Published on Wed, 19 May 2010 16:59:33 GMT Indexed on 2010/05/19 18:10 UTC
Read the original article Hit count: 596

Filed under:

Para iniciar hablaremos un poco sobre el control File Upload, de esta forma daremos una idea general de que es y como trabaja.

El File Upload es un control de asp.net que permite que los usuarios seleccionen un archivo de cualquier ubicación en el equipo y lo suban a un directorio predeterminado a traves de una página asp.net. En principio este control esta limitado para no permitir subir archivos de mas de 4 MB. Sin embargo, desde el webconfig de nuestra aplicacón podremos cambiar ese valor, ya sea para aumentarlo o bien para disminuirlo.

Nuestro ejemplo, se enfocará en crear un webcontrol que permita seleccionar un archivo y guardarlo, asi que empecemos.

Lo primero será agregar a nuestra página un webcontrol que llamaremos Upload.ascx

Posteriormente en nuestro webcontrol, agregamos el siguiente código:

<table style="width: 100%">
        <tr>
            <td colspan="3">
            <div align="center">
                 <asp:Label ID="Label1" runat="server" Text="File Upload"></asp:Label>
             </div>
            </td>
          
        </tr>
        <tr>
            <td style="width: 456px" rowspan="2">
              
             
              
                &nbsp;</td>
            <td style="width: 386px">
          
                    <div align="center">
                        <asp:FileUpload ID="FileUpload1" runat="server" Height="24px" Width="243px" />
                        <span id="Span1" runat="server" />
       
                   </div>     
                </td>
            <td rowspan="2">
              
             
              
                </td>
        </tr>
        <tr>
            <td style="width: 386px">
                <div align="center">
                     <asp:ImageButton Id="btnupload" runat="server" OnClick="btnupload_Click"
                    ImageUrl="~/Styles/img/upload.png" style="text-align: center" />

          </div> 
                </td>
        </tr>
        <tr>
            <td colspan="3">
                &nbsp;</td>
        </tr>
    </table>

 De esta forma nuestro control deberá verse algo así

 

Por último en el code behin de nuestro control agregamos el código a nuestro boton, el cual será el encargado de leer el archivo que se encuentra en el File Upload y guardarlo en la ruta especificada.

 Protected Sub btnupload_Click(ByVal sender As Object, ByVal e As System.Web.UI.ImageClickEventArgs) Handles btnupload.Click
        If FileUpload1.HasFile Then
            Dim fileExt As String
            fileExt = System.IO.Path.GetExtension(FileUpload1.FileName)


            If (fileExt = ".exe") Then
                Label1.Text = "You can´t upload .exe file!"
            Else
                Try
                    FileUpload1.SaveAs(decrpath & _
                       FileUpload1.FileName)
                    Label1.Text = "File name: " & _
                      FileUpload1.PostedFile.FileName & "<br>" & _
                      "File Size: " & _
                      FileUpload1.PostedFile.ContentLength & " kb<br>" & _
                      "Content type: " & _
                      FileUpload1.PostedFile.ContentType
                Catch ex As Exception
                    Label1.Text = "ERROR: " & ex.Message.ToString()
                End Try
            End If

        Else
            Label1.Text = "You have not specified a file!"
        End If
      
    End Sub

 

Como vemos en el código anterior tambien hemos agregado otros elementos los cuales nos dirán el nombre del archivo, el tipo de contenido y el tamaño en kb una vez que el archivo ha sido súbido al servidor.

Por último deben tomar en cuenta que decrpath es la ruta en donde será subido el archivo, la cual deben variar a su gusto.

 

© Geeks with Blogs or respective owner