Sabab Zulfiker

Sabab Zulfiker

  • 1.8k
  • 85
  • 13.5k

File not Passing on ng-file-select in Angular JS

Apr 23 2018 6:02 AM
I am trying to pass a file from html view to angular controller, for this I am using ng-file-select in the view. My view code looks like:
  1. <div ng-controller="fileController">  
  2. <input type="file" ng-model="fibQuestion.fibContentLanguage.colUploadPaperUrl" name="PaperDocUrl" ng-file-select="onPaperFileSelect($files)" onclick="this.value = null" id="forPracticalTestPaper" />  
  3. <div>  
  4. <input type="button" id="save" class="btn btn-success" value="Save" ng-click="PaperFileProcessing()" />  
  5. </div>  
  6. </div>  
But here, ng-file-select="onPaperFileSelect($files)" cannot passing the file to the controllers. The controller code is :
  1. app.controller('fileController',function($scope) {  
  2.        $scope.message = "From Controller";  
  3.        $scope.onPaperFileSelect = function ($files) {  
  4.  if ($scope.verifiedFileType($files[0].name, 'paper')) {  
  5.              $scope.saveFileLoacation = '~/UploadedFiles/PracticalTestPaperFiles/';   
  6.             $scope.yesDisable = false;  
  7.              $scope.uploadedPaper = $files;   
  8.             $('#upload-paper-file-info').text($files[0].name);  
  9.              $scope.showPaperDeleteButton = true;  
  10.          }     };  
  11.          $scope.verifiedFileType = function (fileName, fileType) {   
  12.  var extension = (fileName.substring(fileName.lastIndexOf('.'), fileName.length)).toLowerCase();  
  13.  if (extension == ".pdf") {return true;}       
  14.  else {alert("file extension not valid for " + fileType + ". available extensions are pdf.");   
  15.             angular.element("input[type='file']").val(null);  
  16.  return false;   
  17.         }     };  
  18.              $scope.PaperFileProcessing = function () {  
  19.            $scope.upload = [];  
  20.          $scope.yesDisable = true;   
  21.  var fileBank = $scope.uploadedPaper;  
  22.          console.log(fileBank);   
  23.  var status = false;    
  24.  var i = fileBank.length;   
  25.         console.log(i);      
  26.          };    
  27.      });  
When , I press the save button, that calls the function PaperFileProcessing(), but then, var fileBank = $scope.uploadedPaper; is showing undefined.

Brought to you by: