Form is always disabled

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>&nbsp;&nbsp;
                    <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.

image