apim-developer-portal4/src/components/products/product-subscribe/ko/runtime/product-subscribe.html

API management developer portal

<!-- ko if: working -->
<spinner class="fit"></spinner>
<!-- /ko -->

<!-- ko ifnot: working -->

<!-- ko if: product -->

<!-- ko ifnot: isUserSignedIn -->
<div>
    <button class="button button-primary" data-bind="click: $component.subscribe">Subscribe</button>
</div>
<!-- /ko -->

<!-- ko if: isUserSignedIn -->

<!-- ko if: limitReached -->
<p>
    You've reached maximum number of subscriptions.
</p>
<!-- /ko -->

<!-- ko ifnot: limitReached -->
<form>
    <div class="table">        
        <div class="table-row">
            <div class="col-5">
                <input type="text" class="form-control" placeholder="Your new product subscription name" data-bind="textInput: subscriptionName" />
            </div>
            <div class="col-4 form-inline">
                <!-- ko if: termsOfUse -->
                <div class="form-check">
                    <input id="consentCheckbox" type="checkbox" class="form-check-input" data-bind="checked: consented" />
                    <label for="consentCheckbox" class="form-check-label"> I agree to the Terms of Use. &nbsp;<a href="#" data-bind="click: toggleTermsOfUser, text: showHideLabel"></a></label>
                </div>
                <!-- /ko -->
            </div>
            <div class="col-3">
                <button class="button button-primary" data-bind="click: $component.subscribe, enable: canSubscribe">Subscribe</button>
            </div>
        </div>
    </div>

    <!-- ko if: showTermsOfUse -->
    <textarea class="form-control" rows="10" readonly data-bind="text: termsOfUse"></textarea>
    <!-- /ko -->

</form>
<!-- /ko -->

<!-- /ko -->

<!-- /ko -->

<!-- /ko -->