I have a file upload control added in AngularJs form. I am trying to fetch the data from the file uploaded. I have tried the below code, but the target.result is always empty.
//index.cshtml
<input type="file" class="form-control" id="imageUploadfile" name="Imagefile" accept="image/*" />
<input type="button" name="imageUploadButton" ng-click="uploadFiles()" value="Upload" />
//controller.js
$scope.uploadFiles = function () {
var newdata = "";
var filesSelected = document.getElementById("imageUploadfile").files;
if (filesSelected.length > 0) {
var fileToLoad = filesSelected[0];
var fileReader = new FileReader();
fileReader.onload = function (fileLoadedEvent) {
var newdata = fileLoadedEvent.target.result;
};
fileReader.readAsDataURL(fileToLoad);
}
alert(newdata);
}
How to fix this? I am trying in IE 11, chrome. Note: I do not want to use any plugins, formdata,iframe.