args.get_fileInputField() is not working in IE

[Ajith]

function OnClientFileSelected(sender, args) {
    if ($telerik.isIE) {
        var input = args.get_fileInputField();
        if (sender.isExtensionValid(input.value)) {
            var img = document.createElement("img");
            var thumbnail = document.getElementById("thumbnail");
            thumbnail.appendChild(img);
            if (img) {
                img.style.visibility = "";
                img.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = input.value;

            }
        }
    }
    else {

        var file = args.get_fileInputField().files.item(args.get_rowIndex()); 
        if (!file) {
           showThumbnail(droppedFile);
        }
        else {
            showThumbnail(file);
        }
    }

}



function showThumbnail(file) {


    var image = document.createElement("img");
    var thumbnail = document.getElementById("thumbnail");
    image.file = file;
    thumbnail.appendChild(image);

    var reader = new FileReader()
    reader.onload = (function (aImg) {
        return function (e) {
            aImg.src = e.target.result;
        };
    }(image))
    var ret = reader.readAsDataURL(file);
    var canvas = document.createElement("canvas");

    ctx = canvas.getContext("2d");
    image.onload = function () {
        ctx.drawImage(image, 100, 100);
    }

}

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                        <telerik:RadAsyncUpload ID="UploadImage" runat="server" 
                            
                            onfileuploaded="UploadImage_FileUploaded"   
                            MultipleFileSelection="Disabled"
                            OnClientFileSelected="OnClientFileSelected"
                            OnClientFileUploadRemoved="OnClientFileUploadRemoved"
                            MaxFileInputsCount="1"
                            AllowedFileExtensions="jpg,jpeg,png,gif" MaxFileSize="51200" 
                            ViewStateMode="Enabled">
                        </telerik:RadAsyncUpload>
                 </ContentTemplate>
             </asp:UpdatePanel>
I am using the above code to preview the uploaded image.but it is not working in IE .
This statement is returning null ."var input = args.get_fileInputField();"
Please help me .
Thanks in Advance

[Plamen]

Hello Ajith,

 
You have to set DisablePlugins="true" property of RadAsyncUpload and of course add the following style:

#thumbnail img {
       FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)
        }

Hope this will be helpful. Regards,
Plamen
the Telerik team

[moegal]

this does not seem to be working for me.

Any help?

[Shinu]

Hi moegal,

Unfortunately I couldn't replicate the issue at my end. Please have a look into the sample code snippet which works fine at my end. Please prove your full code and please mention the version of telerik.

ASPX:

<telerik:RadAsyncUpload ID="RadAsyncUpload" runat="server" OnClientFileSelected="OnClientFileSelected">
</telerik:RadAsyncUpload>

JavaScript:

<script type="text/javascript">
    function OnClientFileSelected(sender, args) {
        var input = args.get_fileInputField();
    }
</script>

Thanks,
Shinu.

[Plamen]

Hi ,

Yes indeed it is returning null in cases when Silverlight or Flash plug-in is used s of you want it always to return a proper value you can set DisablePlugins property of the control to "true".

Hope this will explain the issue. 

Regards,
Plamen
Telerik