altinn-designsystem/dist/patterns/02-organismer-70-Modal-innhold-_92-delegering-legg-til/02-organismer-70-Modal-innhold-_92-delegering-legg-til.markup-only.html

Altinn Design system based on Pattern Lab.

<!-- START: 02-organismer-70-Modal-innhold-_92-delegering-legg-til JS doc: formatter.js for org nr, requires a-js-orgNr class -->
<div class="modal-body a-modal-body">
  <div class="pb-2">
    <h2 class="a-h4">Tab heading</h2>
    <div class="pb-2 clearfix">
      <!-- START: 01-molekyler-02-navigasjon-10-faner -->
      <ul class="nav a-tabs " role="tablist">
        <li class="nav-item a-tab">
          <a class="a-tab-btn  active" data-toggle="tab" href="#home" role="tab">
            <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
            <i class="ai ai-deadline   d-none d-sm-inline-block"></i>


            <!-- END: 00-atomer-09-bilder-og-media-15-ikon -->

            Person
          </a>
        </li>
        <li class="nav-item a-tab">
          <a class="a-tab-btn " data-toggle="tab" href="#enterprise" role="tab">
            <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
            <i class="ai ai-deadline   d-none d-sm-inline-block"></i>


            <!-- END: 00-atomer-09-bilder-og-media-15-ikon -->

            Ekstern virksomhet
          </a>
        </li>
        <li class="nav-item a-tab">
          <a class="a-tab-btn " data-toggle="tab" href="#enterpriseuser" role="tab">
            <!-- START: 00-atomer-09-bilder-og-media-15-ikon -->
            <i class="ai ai-deadline   d-none d-sm-inline-block"></i>


            <!-- END: 00-atomer-09-bilder-og-media-15-ikon -->

            Bruker med virksomhetssertifikat
          </a>
        </li>
      </ul>

      <!-- END: 01-molekyler-02-navigasjon-10-faner -->

    </div>
    <div class="tab-content a-tabs-content">
      <div class="tab-pane active" id="home" role="tabpanel">
        <form data-toggle="validator" data-disable="true">
          <div class="row">
            <div class="col-12 col-lg-7">
              <h3 class="a-h4">Hvem vil du legge til?</h3>
              <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

              <div class="form-group a-form-group   ">

                <label class="a-form-label  " for="text-fnr-brukernavn">Fødselsnr&#x2F;brukernavn:</label>

                <div class="a-form-group-items input-group   ">


                  <input class="form-control  
         " type="text" placeholder="11 siffer" name="input-field" data-val="true" id="text-fnr-brukernavn" required data-val-regex="Personnummer må bestå av 11 siffer." data-val-regex-pattern="">




                </div>


                <div class="a-message a-message-error" data-valmsg-for="input-field" data-valmsg-replace="true"></div>
              </div>

              <!-- END: 00-atomer-01-forms-10-tekst-input -->

            </div>
          </div>
          <div class="row">
            <div class="col-12 col-lg-7">
              <div class="mt-1">
                <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

                <div class="form-group a-form-group   ">

                  <label class="a-form-label  " for="text-etternavn">Etternavn:</label>

                  <div class="a-form-group-items input-group   ">


                    <input class="form-control  
         " type="text" name="input-field" data-val="true" id="text-etternavn" required data-val-regex="Personnummer må bestå av 11 siffer." data-val-regex-pattern="">




                  </div>


                  <div class="a-message a-message-error" data-valmsg-for="input-field" data-valmsg-replace="true"></div>
                </div>

                <!-- END: 00-atomer-01-forms-10-tekst-input -->

              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="mt-3">
                <!-- START: 00-atomer-03-knapper-10-knapp -->
                <button type="submit" class="a-btn a-btn-success mb-0">
  
    Neste
  
</button>

                <!-- END: 00-atomer-03-knapper-10-knapp -->

              </div>
            </div>
          </div>
        </form>
      </div>
      <div class="tab-pane " id="enterprise" role="tabpanel">
        <form data-toggle="validator" data-disable="true">
          <div class="row">
            <div class="col-12 col-lg-7">
              <h3 class="a-h4">Hvem vil du legge til?</h3>
              <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

              <div class="form-group a-form-group   ">

                <label class="a-form-label  " for="text-orgno">Org.nr.:</label>

                <div class="a-form-group-items input-group   ">


                  <input class="form-control a-js-orgNr 
         " type="text" name="input-field" data-val="true" id="text-orgno" required>




                </div>


                <div class="a-message a-message-error" data-valmsg-for="input-field" data-valmsg-replace="true"></div>
              </div>

              <!-- END: 00-atomer-01-forms-10-tekst-input -->

            </div>
          </div>
          <div class="row">
            <div class="col-12 col-lg-7">
              <div class="mt-1">
                <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

                <div class="form-group a-form-group   ">

                  <label class="a-form-label  " for="text-bedriftnavn">Navn:</label>

                  <div class="a-form-group-items input-group   ">


                    <input class="form-control  
         " type="text" placeholder="Min. 4 første tegn" name="input-field" data-val="true" id="text-bedriftnavn" required>




                  </div>


                  <div class="a-message a-message-error" data-valmsg-for="input-field" data-valmsg-replace="true"></div>
                </div>

                <!-- END: 00-atomer-01-forms-10-tekst-input -->

              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="mt-3">
                <!-- START: 00-atomer-03-knapper-10-knapp -->
                <button type="submit" class="a-btn a-btn-success mb-0">
  
    Neste
  
</button>

                <!-- END: 00-atomer-03-knapper-10-knapp -->

              </div>
            </div>
          </div>
        </form>
      </div>
      <div class="tab-pane " id="enterpriseuser" role="tabpanel">
        <form data-toggle="validator" data-disable="true">
          <div class="row">
            <div class="col-12 col-lg-7">
              <h3 class="a-h4">Hvem vil du legge til?</h3>
              <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

              <div class="form-group a-form-group   ">

                <label class="a-form-label  " for="text-enterprise-brukernavn">Brukernavn:</label>

                <div class="a-form-group-items input-group   ">


                  <input class="form-control  
         " type="text" name="input-field" data-val="true" id="text-enterprise-brukernavn" required>




                </div>


                <div class="a-message a-message-error" data-valmsg-for="input-field" data-valmsg-replace="true"></div>
              </div>

              <!-- END: 00-atomer-01-forms-10-tekst-input -->

            </div>
          </div>
          <div class="row">
            <div class="col-12 col-lg-7">
              <div class="mt-1">
                <!-- START: 00-atomer-01-forms-10-tekst-input JS doc: handleFocus.js -->

                <div class="form-group a-form-group   ">

                  <label class="a-form-label  " for="text-enterpriseuser-orgno">Org.nr.:</label>

                  <div class="a-form-group-items input-group   ">


                    <input class="form-control a-js-orgNr 
         " type="text" name="input-field" data-val="true" id="text-enterpriseuser-orgno" required>




                  </div>


                  <div class="a-message a-message-error" data-valmsg-for="input-field" data-valmsg-replace="true"></div>
                </div>

                <!-- END: 00-atomer-01-forms-10-tekst-input -->

              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <div class="mt-3">
                <!-- START: 00-atomer-03-knapper-10-knapp -->
                <button type="submit" class="a-btn a-btn-success mb-0">
  
    Neste
  
</button>

                <!-- END: 00-atomer-03-knapper-10-knapp -->

              </div>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>


<!-- END: 02-organismer-70-Modal-innhold-_92-delegering-legg-til -->