kong-dashboard/public/html/upstreams/form.html

Web UI for managing Kong gateway

<div class="container">
    <h3 class="header">{{title}}</h3>

    <div class="row">
        <div class="col s5">
            <div class="card-panel teal">
                <p class="white-text">
                    The upstream object represents a virtual hostname and can be used to loadbalance incoming requests over multiple services (targets). So for example an upstream named service.v1.xyz with an API object created with an upstream_url=https://service.v1.xyz/some/path. Requests for this API would be proxied to the targets defined within the upstream.
                </p>

                <p class="white-text">
                    Checkout <a href="https://getkong.org/docs/latest/admin-api/#add-upstream" target="_blank">Kong documentation</a> for the meaning of the form parameters.
                </p>
            </div>
        </div>
        <form name="addUpstream" class="col s7" novalidate ng-submit="save()">
            <div class="row">
                <div class="input-field col s12" ng-show="isEdit()">
                    <input id="id" ng-model="upstream.id" type="text" class="validate"
                        ng-class="{invalid: error.id}" ng-readonly="isEdit()" >
                    <label for="id" ng-class="{active:upstream.id}">ID</label>
                    <app-field-error error="error.id"></app-field-error>
                </div>
                <div class="input-field col s12">
                    <input id="name" autofocus ng-required="true" ng-model="upstream.name" type="text" 
                        ng-class="{invalid: error.name}" class="validate" >
                    <label for="name" ng-class="{active:upstream.name}">Name</label>
                    <app-field-error error="error.name"></app-field-error>
                </div>
                <div class="input-field col s12">
                    <input id="slots" autofocus ng-required="true" ng-model="upstream.slots" type="text" 
                        ng-class="{invalid: error.slots}" class="validate" >
                    <label for="slots" ng-class="{active:upstream.slots}">Slot</label>
                    <app-field-error error="error.slots"></app-field-error>
                </div>

                <div class="input-field col s4">
                    <a href="#/upstreams/{{upstream.id}}/targets/add" class="waves-effect waves-light btn" ng-show="isEdit()">
                        <i class="material-icons left">add_box</i>
                        Add Target
                    </a>
                </div>
                <div class="input-field col s4">
                    <a href="#/upstreams/{{upstream.id}}/targets" class="waves-effect waves-light btn" ng-show="isEdit()">
                        <i class="material-icons left">list</i>
                        List Target
                    </a>
                </div>
                <div class="input-field col s4">
                    <button type="submit" class="waves-effect waves-light btn right">
                        {{action}}
                    </button>
                </div>
            </div>
            <input type="hidden" ng-model="upstream.id" value="{{upstream.id}}"/>
        </form>
    </div>
</div>