Incompatibility to upload files by IPad

I'm having a problem uploading files on the iPad. Via web interface, I can upload normal image, but when I do for the Ipad, it does not change the name of the file and only lets upload images, pdf's and other types of files it nor displays for selection. Has anyone ever had a similar problem?

Html:

    <div class="modal-header">
              <button type="button" class="close" ng-click="cancel()"><span aria-hidden="true">&times;</span><span class="sr-only"><span data-i18n="Fechar"></span></span></button>
              <h4 class="modal-title" id="modalPhotoUpload"><span data-i18n="Enviar Foto"></span></h4>
            </div>
            <div class="modal-body">
                <p>
                    <input type="file" ng-file-select="onFileSelect($files)" onclick="this.value=null" accept="image/*">
                    <img ng-src="{{img}}" ng-show="{{show_img}}" width="50px">
                </p>
                <p>
                  <div ng-show="dropSupported" class="drop-box" ng-file-drop="onFileSelect($files)" ng-file-drop-available="dropSupported=true" ng-file-drag-over-class="dragOverClass($event)" class="drop-box" ng-file-drag-over-delay="100">
                      <div ng-if="show_img">
                        <div>
                          <img alt="" src="{{img_src}}" ng-show="show_img" class="img-circle img40_40">
                        </div>
                      </div>
                      <div ng-if="!show_img">
                        <span data-i18n="Arraste a imagem para cá"></span>. 
                        <div>
                          <span class="glyphicon glyphicon-camera"></span>
                        </div>
                      </div>
                  </div>
                <div ng-file-drop-available="dropSupported=true" 
                      ng-show="!dropSupported" ><span data-i18n="Seu Browser não suporta este aplicativo"></span>.</div></p>
                <p><progressbar class="{{progress_class}}" value="dynamic" type="{{type}}">{{dynamic}}% <i ng-show="showWarning"><span data-i18n="Completo"></span></i></progressbar></p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" ng-click="cancel()"><span data-i18n="Fechar"></span></button>
              <button type="button" class="btn btn-primary" ng-click="ok()"><span data-i18n="Salvar"></span></button>
            </div>

Angular:

    .controller('ModalInstanceCtrl', function ($scope, $modalInstance, $http, $upload, $timeout, action, API_ENDPOINTS) {
                $scope.alerts = [];
                $scope.data = [];
                $scope.initDate = new Date('2016-15-20');
                $scope.type = 'warning';
                $scope.formats = ['dd-MMMM-yyyy', 'yyyy/MM/dd', 'dd.MM.yyyy', 'shortDate'];
                $scope.format = $scope.formats[0];
                $scope.show_img = false;
                $scope.img_name = null;
                $scope.img_src = null;
                $scope.file_box_label = "Arraste um arquivo para cá";

                $scope.onFileSelect = function ($files) {
                  $scope.max = 100;
                  $scope.progress_class = 'progress-striped active';
                  // $files: an array of files selected, each file has name, size, and type.
                  for (var i = 0; i < $files.length; i++) {
                    var file = $files[i];
                    if(action.args.rename){
                      $scope.img_name = action.args.rename;
                    }else{
                      $scope.img_name = file.name;
                    }
                    $scope.upload = $upload.upload({
                      url: action.action_url, //upload.php script, node.js route, or servlet url
                      method: 'POST',
                      data: {file: file, fileName: $scope.img_name}
                      //file: file // or list of files ($files) for html5 only
                      //fileName: 'doc.jpg' or ['1.jpg', '2.jpg', ...] // to modify the name of the file(s)
                      // customize file formData name ('Content-Disposition'), server side file variable name. 
                      //fileFormDataName: myFile, //or a list of names for multiple files (html5). Default is 'file' 
                      // customize how data is added to formData. See #40#issuecomment-28612000 for sample code
                      //formDataAppender: function(formData, key, val){}
                    }).progress(function(evt) {
                      $scope.dynamic = parseInt(100.0 * evt.loaded / evt.total);
                      if($scope.dynamic >= 99){
                          $scope.progress_class = 'progress-striped';
                      }
                    }).success(function(data, status, headers, config) {
                      $scope.file_box_label = $scope.img_name;
                      $scope.img_src = (API_ENDPOINTS.baseURL + 
                      API_ENDPOINTS.courseLogosFolder + $scope.img_name);
                      $scope.type = 'success';
                      $scope.show_img = true;
                      $scope.alerts.splice(0, 1);
                      $scope.alerts.push({'type':'success','msg':'O arquivo foi enviado com sucesso. Clique em Salvar.'});
                    }).error(function(data, status, headers, config){
                      $scope.file_box_label = "Ocorreu um error, tente novamente. Arraste um arquivo para cá";
                      $scope.type = 'danger';
                      $scope.alerts.splice(0, 1);
                      $scope.alerts.push({'type':'danger','msg':'Ocorreu um erro no upload do arquivo. Tente novamente.'});
                      console.log(data);
                    });
                    $timeout(function () {
                        $scope.alerts.splice(0, 1);
                      }, 4000);
                  }
                };

                $scope.ok = function () {
                  $scope.data.img_name = $scope.img_name;
                  $modalInstance.close($scope.data);
                };

                $scope.cancel = function () {
                  $modalInstance.dismiss('cancel');
                };

                $scope.close = function () {
                  $modalInstance.dismiss('cancel');
                };

                $scope.closeAlert = function(index) {
                  $scope.alerts.splice(index, 1);
                };
              });