1

I have this radupload:

 <telerik:RadUpload ID="RadAsyncUploadBoxLogo"  ClientID="RadAsyncUploadBoxLogo"

                                                            runat="server" ControlObjectsVisibility="None"
                                                            MaxFileInputsCount="1" MaxFileSize="4000000" OverwriteExistingFiles="True" ReadOnlyFileInputs="True"
                                                           Height="10px" TabIndex="12" OnClientFileSelected="OnClientFileSelectedHandler"
                                                            >
                                                            <Localization Remove="" Select=" Seleccionar Imagen" />
                                                        </telerik:RadUpload>

And i have this tag image

 <asp:Image ID="ImageLogo" ClientId="ImageLogo" CssClass="ImgLogo" runat="server"/>

with this script I try to put the image in the image tag:

function myOnClientFileSelect(radUpload, eventArgs) {

    var url = radUpload.getFileInputs()[0].Value;
    $('.ImgLogo').attr("src", url);

}

The problem is that the variable url throws me a path: fakepath/filename , I read that the radupload throws for security so that others can not access the file path , but as how to get the real path of the file to display it on the tag image

  • 1
    You cannot get a path from an ``, but you can access the file itself and use it in the same way as you can use _Blobs_, i.e. you can generate a blob uri and point an image at that – Paul S. Mar 06 '15 at 18:08

1 Answers1

2

Where file_input is a reference to a <input type="file"> and img is a reference to an <img>, in the change handler you can do

if (file_input.files && file_input.files.length) { // some file has been set
    // generate a blob uri to the file
    var uri = URL.createObjectURL(file_input.files[0]);
    // set this as the src of your <img>
    img.src = uri;
}

This code uses URL.createObjectURL which requires IE 10+, to support lower versions of IE you may need to use a <canvas> instead of an <img> so you can load the file differently.

Paul S.
  • 64,864
  • 9
  • 122
  • 138