Error: 405 - HTTP verb used to access this page is not allowed

[venkat18]

Hi @leon ,
I am trying to use the file upload in AngularJs. The code is hit on the "onComplete" , but in the console the data is shown as undefined. I am using IIS 8.
In the console:

[SimpleCtrl.onUpload [object FileList]
   "SimpleCtrl.onUpload"
   {
      [functions]: ,
      0: { },
      __proto__: { },
      constructor: { },
      length: 1
   }

SimpleCtrl.onComplete [object Object]
   "SimpleCtrl.onComplete"
   {
      [functions]: ,
      __proto__: { },
      config: { },
      data: undefined,
      headers: [ ],
      status: 200
   }](url)

In the response body , I can see this: 405 - HTTP verb used to access this page is not allowed.
The page you are looking for cannot be displayed because an invalid method (HTTP verb) was used to attempt access
I added the js, css files and in the Index.cshtml

 <div>                 
                    
                        <div class="panel panel-default" >
                          
                                <div class="form-group">
                               
                                    <input id="accept-mimetypes" class="form-control" type="text" ng-model="acceptTypes" />
                                </div>
                            <upload-button class="btn btn-primary btn-upload"
                                           url="https://server.com/TestApp/Images"
                                           param="file"
                                           accept="acceptTypes"
                                           multiple="false"
                                           force-iframe-upload="true"
                                           data="uploadData"
                                           on-upload="onUpload(files)"
                                           on-success="onGlobalSuccess(response)"
                                           on-error="onError(response)"
                                           on-complete="onComplete(response)">Fileupload
                            </upload-button>
                        </div>
                        </div>

                    <div class="list-group">
                               <a class="list-group-item" ng-href="/uploads/{{file}}" download ng-repeat="file in uploads">{{file}}</a>
                       
                    </div>

In the controller.js file

angular.module('testApp.controllers', ['lr.upload', 'lr.upload.iframe']).
controller('testController', function ($scope, testAPIService, $http) {

$scope.acceptTypes = 'image/*';

    
  $scope.uploadData = {
        myformdata: 'hello world'
    };

   

 $scope.onUpload = function (files) {
      
        console.log('SimpleCtrl.onUpload', files);
    };

    

$scope.onError = function (response) {
      
        console.error('SimpleCtrl.onError', response);
  
      $scope.responseData = response.data;
    };

   
 $scope.onComplete = function (response) {
    
        console.log('SimpleCtrl.onComplete', response);
    
    $scope.responseData = response.data;
    };
});

The code is hitting onUpload function and after that onComplete function. status shows 200, data is undefined, but the file is not uploaded.
I am trying to use single image file upload and to use the "iframe" functionality.
What am I missing? How to fix this?