diff --git a/app/scripts/controllers/client/UploadClientIdentifierDocumentController.js b/app/scripts/controllers/client/UploadClientIdentifierDocumentController.js
index fabd62df..8e7e2286 100644
--- a/app/scripts/controllers/client/UploadClientIdentifierDocumentController.js
+++ b/app/scripts/controllers/client/UploadClientIdentifierDocumentController.js
@@ -3,15 +3,11 @@
         UploadClientIdentifierDocumentController: function (scope, location, routeParams, API_VERSION, Upload, $rootScope) {
             scope.clientId = routeParams.clientId;
             scope.resourceId = routeParams.resourceId;
-            scope.onFileSelect = function ($files) {
-                scope.file = $files[0];
-            };
-
-            scope.submit = function () {
+            scope.uploadPic = function (file) {
                 Upload.upload({
                     url:  $rootScope.hostUrl + API_VERSION + '/client_identifiers/' + scope.resourceId + '/documents',
                     data: scope.formData,
-                    file: scope.file
+                    file: file
                 }).then(function (data) {
                         // to fix IE not refreshing the model
                         if (!scope.$$phase) {
diff --git a/app/views/clients/addclientidentifierdocument.html b/app/views/clients/addclientidentifierdocument.html
index 67050666..ec7bb6a3 100644
--- a/app/views/clients/addclientidentifierdocument.html
+++ b/app/views/clients/addclientidentifierdocument.html
@@ -30,7 +30,7 @@
                         class="required">*</span></label>
 
                 <div class="col-sm-3">
-                    <input type="file" id="file" nv-file-select="onFileSelect($files)">
+                    <input type="file" ng-model="picFile" id="file" ngf-select>
                 </div>
             </div>
 
@@ -38,7 +38,7 @@
                 <a id="cancel" href="#/viewclient/{{clientId}}">
                     <button type="reset" class="btn btn-default">{{'label.button.cancel' | translate}}</button>
                 </a>
-                <button id="save" type="submit" ng-disabled="!clientidentifierform.$valid" class="btn btn-primary" has-permission='CREATE_CLIENTIDENTIFIER'>
+                <button id="save" type="submit" ng-click="uploadPic(picFile)" ng-disabled="!clientidentifierform.$valid" class="btn btn-primary" has-permission='CREATE_CLIENTIDENTIFIER'>
                     {{'label.button.save' | translate}}
                 </button>
             </div>
diff --git a/test/spec/controllers/client/UploadClientIdentifierDocumentController_spec.js b/test/spec/controllers/client/UploadClientIdentifierDocumentController_spec.js
index a6a86eec..dc51e612 100644
--- a/test/spec/controllers/client/UploadClientIdentifierDocumentController_spec.js
+++ b/test/spec/controllers/client/UploadClientIdentifierDocumentController_spec.js
@@ -23,31 +23,25 @@ describe('UploadClientIdentifierDocumentController', function() {
     ); 
   }));
 
-  it('should put the select file in the scope', function(){
-    var file = {name: 'some file'}
-    this.scope.onFileSelect ([file]);
-    expect(this.scope.file).toBe(file);
-  });
-
-  describe('on submit', function(){
+  describe('on uploadPic', function(){
     var url;
     beforeEach(function(){
       url = this.$rootScope.hostUrl + this.API_VERSION + '/client_identifiers/' + this.routeParams.resourceId + '/documents';
-      this.scope.file = {name: 'some file'}  
+      picFile = {name: 'some file'}  
       this.scope.formData = 'formData';
     });
 
     it('should call the upload service', function(){ 
-      this.scope.submit();  
+      this.scope.uploadPic(picFile);  
       expect(this.upload.upload).toHaveBeenCalledWith({
         url: url,
         data: this.scope.formData,
-        file: this.scope.file,
+        file: picFile,
       });
     });
 
     it('should change the location after file has been uploaded', function(){
-      this.scope.submit();
+      this.scope.uploadPic();
       deferedUpload.resolve('data');
       this.scope.$digest();
       expect(this.location.path).toHaveBeenCalledWith('/viewclient/' + this.routeParams.clientId);