Form validation does not work correctly. I have following template, note submit button is outside of the form
<ion-content class="has-header padding">
<ion-list ng-if="!isConnectionError">
<div class="margin-top-50 padding-top padding-bottom center">
<h3>{{'confirm_send_receipt' | translate}}</h3>
</div>
<form name="receiptForm" id="receiptForm">
<label class="item item-input">
<i class="icon ion-email placeholder-icon"></i>
<input name="email" ng-model="emailField.email" type="email"
placeholder="{{'email' | translate}}">
</label>
</form>
</ion-list>
</ion-content>
<ion-footer-bar class="footer-bottom-margin">
<div class="col center">
<button ng-click="skipButtonClicked()" class="button button-block button-stable footer-buttons">
{{'skip' | translate}}
</button>
</div>
<div class="col center">
<button form="receiptForm"
ng-disabled="!receiptForm.email.$valid"
ng-click="sendReceiptButtonClicked()"
class="button button-block button-assertive footer-buttons">
{{'send_receipt' | translate}}
</button>
</div>
</ion-footer-bar>
This button is always disabled even if I write correct email address.