D-Net

  <div>

    <div class="interfaceActionsPanel">

      <a (click)="saveInterface()"><i class="fa fa-save fa-lg"></i></a>

    </div>

    <div>

      <h5>OpenDOAR Interface (non-removable)</h5>

    </div>

  </div>

  <div>

    <div [formGroup]="group">

      <div *ngIf="successMessage" class="uk-alert uk-alert-success">{{ successMessage }}</div>

      <div *ngIf="errorMessage" class="uk-alert uk-alert-danger">{{ errorMessage }}</div>

      <div class="form-group has-success">

        <label class="control-label" for="baseUrl">Base OAI-PMH URL (*)</label>

        <span class="help-block inline" style="margin-top: 0px; margin-bottom: 0px; padding-left: 10px;">

          Identified

        </span>

        <input id="baseUrl" type="text" class="form-control" formControlName="baseUrl" required="true">

      </div>

      <div class="form-group">

        <label class="control-label">Validation Set</label>

        <div>

          <label class="uk-button validationSetRadio" for="selectRadio{{index}}">

            <input id="selectRadio{{index}}" value="select" name="validationSet{{index}}" type="radio" (change)="chooseValSet(true)" checked>

            <span>Choose existing</span>

          </label>

        </div>

        <select id="selectValidationSet{{index}}" formControlName="selectValidationSet" class="form-control" >

          <option value="">-- none selected --</option>

          <option value="blabla">I'm choosing blabla</option>

          <option value="blabla2">blabla again</option>

        </select>

        <div>

          <label class="uk-button validationSetRadio" for="customRadio{{index}}">

            <input id="customRadio{{index}}" value="custom" name="validationSet{{index}}" type="radio" (change)="chooseValSet(false)">

            <span>or a custom one</span>

          </label>

        </div>

        <input id="customValidationSet{{index}}" formControlName="customValidationSet" class="form-control" type="text">

      </div>

      <div class="form-group">

        <label class="control-label" for="compLvl">Desired Compatibility Level (*)</label>

        <select class="form-control" #compLvl id="compLvl" formControlName="compatibilityLevel">

          <option value="">-- none selected --</option>

          <option value="moreblabla">blabla otra vez</option>

          <option value="blabla1">another blabla option</option>

        </select>

      </div>

      <div>

        <label class="uk-form-controls-text control-label">Current Compatibility Level</label>

        <div *ngIf="compLvl == ''">not available</div>

        <div *ngIf="compLvl != ''">{{ compLvl.value }}</div>

      </div>

    </div>

  </div>