Prekočiť na hlavný obsah
Oficiálna stránka SK

Doména gov.sk je oficálna

Toto je oficiálna webová stránka orgánu verejnej moci Slovenskej republiky. Oficiálne stránky využívajú najmä doménu gov.sk. Odkazy na jednotlivé webové sídla orgánov verejnej moci nájdete na tomto odkaze.

Táto stránka je zabezpečená

Buďte pozorní a vždy sa uistite, že zdieľate informácie iba cez zabezpečenú webovú stránku verejnej správy SR. Zabezpečená stránka vždy začína https:// pred názvom domény webového sídla.

Späť

Radio

Kedy použiť tento komponent

Komponent použite, keď užívateľ môže vybrať iba jednu z možností

Kedy nepoužiť tento komponent

Nepoužívajte komponent, ak potrebujete umožniť používateľom zadať viac možností. V tomto prípade použite checkboxes.

Prepínače umiestnené vedľa seba

Máte už vytvorený osobný účet?

<div class="govuk-form-group">
  <fieldset class="govuk-fieldset">
    <legend class="govuk-fieldset__legend govuk-fieldset__legend">
      Máte už vytvorený osobný účet?
    </legend>

    <div class="govuk-radios govuk-radios--inline">
      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="changed-name" name="changed-name" type="radio" value="ano">
        <label class="govuk-label govuk-radios__label" for="changed-name">
          Áno
        </label>       
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="changed-name-2" name="changed-name" type="radio" value="nie">
        <label class="govuk-label govuk-radios__label" for="changed-name-2">
          Nie
        </label>
      </div>
    </div>
  </fieldset>
</div>

Prepínače umiestnené pod sebou

V ktorej časti Slovenska žijete?

<div class="govuk-form-group">
  <fieldset class="govuk-fieldset">
    <legend class="govuk-fieldset__legend govuk-fieldset__legend">
      V ktorej časti Slovenska žijete?
    </legend>

    <div class="govuk-radios">
      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="v-ktorej-casti-slovenska-zijete" name="v-ktorej-casti-slovenska-zijete" type="radio" value="zapadneSlovensko">
        <label class="govuk-label govuk-radios__label" for="v-ktorej-casti-slovenska-zijete">
          Západné Slovensko
        </label>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="v-ktorej-casti-slovenska-zijete-2" name="v-ktorej-casti-slovenska-zijete" type="radio" value="stredneSlovensko">
        <label class="govuk-label govuk-radios__label" for="v-ktorej-casti-slovenska-zijete-2">
           Stredné Slovensko
        </label>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="v-ktorej-casti-slovenska-zijete-3" name="v-ktorej-casti-slovenska-zijete" type="radio" value="vychodneSlovensko">
        <label class="govuk-label govuk-radios__label" for="v-ktorej-casti-slovenska-zijete-3">
            Východne Slovensko
        </label>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="v-ktorej-casti-slovenska-zijete-4" name="v-ktorej-casti-slovenska-zijete" type="radio" value="zijemMimo">
        <label class="govuk-label govuk-radios__label" for="v-ktorej-casti-slovenska-zijete-4">
          Žijem mimo Slovenska
        </label>
      </div>
    </div>
  </fieldset>
</div>

Prepínače s nápovedou

Ako sa chcete prihlásiť?Musíte byť zaregistrovaný na našom portáli
Použijete meno a heslo, ktoré ste si vybrali pri registrácii.
Použijete svoj občiansky preukaz a čítačku.

<div class="govuk-form-group">
  <fieldset class="govuk-fieldset" aria-describedby="prihlasenie-hint">
    <legend class="govuk-fieldset__legend govuk-fieldset__legend--l">
      Ako sa chcete prihlásiť?
    </legend>
    <span id="prihlasenie-hint" class="govuk-hint">
    Musíte byť zaregistrovaný na našom portáli
    </span>
    <div class="govuk-radios">
      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="prihlasenie" name="prihlasenie" type="radio" value="meno a heslo" aria-describedby="prihlasenie-item-hint">
        <label class="govuk-label govuk-radios__label" for="prihlasenie">
          Prihlásiť sa pomocou mena a hesla
        </label>
        <span id="prihlasenie-item-hint" class="govuk-hint govuk-radios__hint">
          Použijete meno a heslo, ktoré ste si vybrali pri registrácii.
        </span>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="prihlasenie-2" name="prihlasenie" type="radio" value="obciansky preukaz" aria-describedby="prihlasenie-2-item-hint">
        <label class="govuk-label govuk-radios__label" for="prihlasenie-2">
          Prihlásiť sa pomocou čítačky občianskeho preukazu
        </label>
        <span id="prihlasenie-2-item-hint" class="govuk-hint govuk-radios__hint">
          Použijete svoj občiansky preukaz a čítačku.
        </span>
      </div>
    </div>
  </fieldset>
</div>

Chybový stav

Zmenili ste si meno?Odpoveď sa týka aj zmeny priezviska Error: Toto pole je povinné

<div class="govuk-form-group govuk-form-group--error">
  <fieldset class="govuk-fieldset" aria-describedby="zmenene-meno-hint zmenene-meno-error">
    <legend class="govuk-fieldset__legend govuk-fieldset__legend--l">
      Zmenili ste si meno?
    </legend>
    <span id="zmenene-meno-hint" class="govuk-hint">
      Odpoveď sa týka aj zmeny priezviska
    </span>
    <span id="zmenene-meno-error" class="govuk-error-message">
    <span class="govuk-visually-hidden">Error:</span> Toto pole je povinné
    </span>
    <div class="govuk-radios govuk-radios--inline">
      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="zmenene-meno" name="zmenene-meno" type="radio" value="ano">
        <label class="govuk-label govuk-radios__label" for="zmenene-meno">
          Áno
        </label>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="zmenene-meno-2" name="zmenene-meno" type="radio" value="nie">
        <label class="govuk-label govuk-radios__label" for="zmenene-meno-2">
          Nie
        </label>
      </div>
    </div>
  </fieldset>
</div>

Neaktívny stav

V ktorej časti Slovenska žijete?

<div class="govuk-form-group">
  <fieldset class="govuk-fieldset">
    <legend class="govuk-fieldset__legend govuk-fieldset__legend">
      V ktorej časti Slovenska žijete?
    </legend>
    <div class="govuk-radios">
      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="neaktivny-stav" name="neaktivny-stav" type="radio" value="zapadneSlovensko" disabled>
        <label class="govuk-label govuk-radios__label" for="neaktivny-stav">
          Západné Slovensko
        </label>
      </div>
      
      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="neaktivny-stav-2" name="neaktivny-stav" type="radio" value="stredneSlovensko">
        <label class="govuk-label govuk-radios__label" for="neaktivny-stav-2">
          Stredné Slovensko
        </label>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="neaktivny-stav-3" name="neaktivny-stav" type="radio" value="vychodneSlovensko">
        <label class="govuk-label govuk-radios__label" for="neaktivny-stav-3">
          Východne Slovensko
        </label>
      </div>

      <div class="govuk-radios__item">
        <input class="govuk-radios__input" id="neaktivny-stav-4" name="neaktivny-stav" type="radio" value="zijemMimo">
        <label class="govuk-label govuk-radios__label" for="neaktivny-stav-4">
          Žijem mimo Slovenska
        </label>
      </div>
    </div>
  </fieldset>
</div>

Podmienečné prepínače

Aký je váš preferovaný spôsob kontaktovania?


<div class="govuk-form-group">
   <fieldset class="govuk-fieldset">
      <legend class="govuk-fieldset__legend govuk-fieldset__legend--l">
         <h1 class="govuk-fieldset__heading">
            Aký je váš preferovaný spôsob kontaktovania?
         </h1>
      </legend>
      <div class="govuk-radios govuk-radios--conditional" data-module="govuk-radios">
         <div class="govuk-radios__item">
            <input class="govuk-radios__input" id="contact" name="contact" type="radio" value="email" data-aria-controls="conditional-contact">
            <label class="govuk-label govuk-radios__label" for="contact">
              Email
            </label>
         </div>
         <div class="govuk-radios__conditional govuk-radios__conditional--hidden" id="conditional-contact">
            <div class="govuk-form-group">
               <label class="govuk-label" for="kontakovanie-emailom">
                 E-mailová adresa
               </label>
               <input class="govuk-input govuk-!-width-one-third" id="kontakovanie-emailom" name="kontakovanie-emailom" type="email">
            </div>
         </div>
         <div class="govuk-radios__item">
            <input class="govuk-radios__input" id="contact-2" name="contact" type="radio" value="telefon" data-aria-controls="conditional-contact-2">
            <label class="govuk-label govuk-radios__label" for="contact-2">
              Telefón
            </label>
         </div>
         <div class="govuk-radios__conditional govuk-radios__conditional--hidden" id="conditional-contact-2">
            <div class="govuk-form-group">
               <label class="govuk-label" for="kontaktovanie-telefonicky">
                 Telefónne číslo
               </label>
               <input class="govuk-input govuk-!-width-one-third" id="kontaktovanie-telefonicky" name="kontaktovanie-telefonicky" type="tel">
            </div>
         </div>
         <div class="govuk-radios__item">
            <input class="govuk-radios__input" id="contact-3" name="contact" type="radio" value="textova-sprava" data-aria-controls="conditional-contact-3">
            <label class="govuk-label govuk-radios__label" for="contact-3">
              Textová správa
            </label>
         </div>
         <div class="govuk-radios__conditional govuk-radios__conditional--hidden" id="conditional-contact-3">
            <div class="govuk-form-group">
               <label class="govuk-label" for="kontaktovanie-spravou">
                 Telefónne číslo
               </label>
               <input class="govuk-input govuk-!-width-one-third" id="kontaktovanie-spravou" name="kontaktovanie-spravou" type="tel">
            </div>
         </div>
      </div>
   </fieldset>
</div>