How to detect file name exist on upload in Angular file manager

Question

I'm using Angular File Manager In My current Angularjs App.

I want to show an error(like: file name exist) to user when upload a file with name exist in a directory.

$scope.uploadFiles = function () {

    /*******  I added these ↓↓↓ ********/
    var item = $scope.singleSelection();
    if (item) {
       var name = item.tempModel.name.trim();
       var nameExists = $scope.fileNavigator.fileNameExists(name);
       if (nameExists && validateSamePath(item)) {
          // this name is exist, so ↓
          $scope.apiMiddleware.apiHandler.error = $translate.instant('error_invalid_filename');
          return false;
       }
    }

/******* these code are exist before(your code) ↓↓↓ ********/

$scope.apiMiddleware.upload($scope.uploadFileList, $scope.fileNavigator.currentPath).then(function () {
       $scope.fileNavigator.refresh();
       $scope.uploadFileList = [];
       $scope.modal('uploadfile', true);
    }, function (data) {
       var errorMsg = data.result && data.result.error || $translate.instant('error_uploading_files');
       $scope.apiMiddleware.apiHandler.error = errorMsg;
    });
}

But in this case, I should to select an item then upload a file, means that, If I don't select a file and upload a new file with same name, error not appear. I need to detect with current file fileName that uploaded

How Can I Achieve This? Thanks in advance

try to put your function with the "onchange" or ngchange, onchange={{myfunction}} on your input type file. — bormat
– bormat, Commented Jan 20, 2018 at 7:50

Morteza QorbanAlizade · Accepted Answer · 2018-03-18 11:27:22Z

I Solved the problem after many search and test codes.

I Add time stamp to file name if repetitive.

In main.js file

function checkRepetitive(file) {
    var currentList = $scope.fileNavigator.fileList;
    var repetitive = false;
    angular.forEach(currentList, function (item, index) {
       if (item.model.name === file.name) {
          repetitive = true
       }
    });

    return repetitive;
}


// click on upload file button in upload modal
$scope.uploadFiles = function () {

    angular.forEach($scope.uploadFileList, function (item, index) {

       if (checkRepetitive(item)) {

          // `morteza.jpg` => `morteza` + `new Date().getTime()).toString()` + `.jpg`
          var lastDotIndex = item.name.lastIndexOf('.');
          var fileName = item.name.substring(0, lastDotIndex);
          var extension = item.name.substring(lastDotIndex, item.name.length);

          // name was `read only` so, I can't change that if didn't write this ↓
          Object.defineProperty(item, 'name', {
             writable: true
          });

          angular.extend(item, {'name': fileName + (new Date().getTime()).toString() + extension});

       } // if (checkRepetitive(item)) {

 });

Collectives™ on Stack Overflow

How to detect file name exist on upload in Angular file manager

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related