Niranjan Godbole
Niranjan Godbole

Reputation: 2175

Validation for file upload in angularjs

Hi I am developing web application in angularjs. I am developing file upload module. I have one form and inside form i have file upload control. On clicking on submit(submitting form) if the file is not uploaded then i want to make file control as red. i have designed css class to make file control red.

 <div class="upload-button bank button1" ng-class="{'has-error': 
      vm.hasFileInputError(myFileID) }">
       <div class="upload-button-icon" >
             <span class="text">{{ 'ID' | translate }}</span>
                    <input type="file" file-modelsr="myFileID" />
       </div>
   </div>

I am writing validation rule in javascript.

 $scope.vm = {};
            function hasFileInputError(myFileID) {
                return this.form2.$submitted && this.form2.myFileID.$invalid ||
                  form2.myFileID.$invalid && form2.myFileID.$dirty;
            }

On clicking on submit button if file has not uploaded then i want to make file control as red. This is not happening. I am trying to figure out this issue but nothing worked out. May i get some help to fix this? Thank you.

Upvotes: 1

Views: 996

Answers (1)

Ramesh Rajendran
Ramesh Rajendran

Reputation: 38683

You have pass your myFileID to function. then why you need $form validation? Because if any other fields are not valid then the form.&dirty always return false.

So better to change your method be like

vm.hasFileInputError = function (myFileID) {
                return myFileID == undefined || myFileID == '' ? true : false
            }

EDIT:

And you should read this discussion : AngularJS - Why use "Controller as vm"?

Upvotes: 1

Related Questions