Is an AngularJS Form Item validated if it isn't displayed using jQuery hide()?

Question

and yes, it's 2020 and I'm still using AngularJS 1.x instead of Angular, but it's for a project at work, so I don't have a choice in the matter.

Anyway, I'm trying to set up a form that needs to validate correctly when one of two fields (but not both or none, as only one is even visible at a time based on the state of a radio button set) is filled out. Essentially, I need exclusive-or validation, and I'm really hoping I don't need to create a custom HTML tag or property for it.

The easiest solution I've thought of might actually play in with the way the form works already, in that depending on the value of a radio button, one of two form entry items is shown (using jQuery's hide() and show() methods, not ng-hide, ng-show or ng-if). My question is, does jQuery's hide() method completely remove the div from the page like CSS' display: none property? If so, will the validation even check the undisplayed div? Otherwise, how would I go about validating one or the other but not both based on which is shown?

Unfortunately I can't include any code or plunker because my job has me under NDA, sorry, but hopefully I've given enough information.

Thanks.

Answer 1

<div ng-if="myVar">
  Displays if myVar truthy
</div>

This should fix your problem.