Recently I faced an requirement where I have to plugin
ng-message validation which depends on value of other input field means if value of field A is given then only field B is mandatory. For example, if user is providing phone no then email is not mandatory else email is mandatory.
Yes we can achieve this in a very simple and straight forward way. Lets see how.
ng-messages validation depending upon the value of other field
ng-messages validation simple works with html5 validation rules like
so if we can manipulate
required tag at run time depending upon our condition then we can simple switch
ng-message validation ON/OFF from that field.
lets see an example:
in my case if user provide his/her phone number then his/her email is not required and even we will not show the email field.
<form name="userform"> <div id="phoneDiv"> <label>Enter phone no:</lable> <input type="text" name="phoneno" ng-model="form.phoneNo" /> </div> <div id="emailDiv" ng-show="!form.phoneNo"> <label>Enter email id:</lable> <input ng-required="!form.phoneNo" type="text" name="emailid" ng-model="form.emailId" /> <div role="alert" ng-messages="userform.emailid.$error"> <div ng-message="required"> email id is required if phone no is not given. </div> </div> </div> </form>
Above approach can help us to achieve our goal.
Working example can be found here.