JavaScript

<pre>        <script type="text/javascript">

            function OnClientFileSelected(sender, args) {
                if ($telerik.isIE9 || $telerik.isIE8 || $telerik.isIE7) {
                    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()),
                        index = 0;
                    while (!file) {
                        file = args.get_fileInputField().files.item(index);
                        index++;
                    }
                    var $row = $telerik.$(args.get_row());
                    showThumbnail(file, $row);
                    
                }

            }


            function showThumbnail(file, row) {

                var image = document.createElement("img"),
                    thumbnail = document.getElementById(row.context.id),
                    breakLine = document.createElement("br");
                image.file = file;
                thumbnail.appendChild(breakLine);
                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),
                    canvas = document.createElement("canvas");

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

                if (image.naturalWidth > image.naturalHeight) {
                    if (image.naturalWidth > MAX_WIDTH) {
                        height *= MAX_WIDTH / image.naturalWidth;
                        width = MAX_WIDTH;
                    }
                } else {
                    if (image.naturalHeight > MAX_HEIGHT) {
                        width *= MAX_HEIGHT / image.naturalHeight;
                        height = MAX_HEIGHT;
                    }
                }

                var MAX_WIDTH = 800,
                    MAX_HEIGHT = 600,
                    width = image.naturalWidth,
                    height = image.naturalHeight;

                canvas.width = width;
                canvas.height = height;
              

                var dataurl = canvas.toDataURL("image/png");
            }

        </script>