Monivalintatyökalut: Valintaruutu, Radioryhmä ja Pudotusvalikko

Monivalintatyökalut: Valintaruutu, Radioryhmä ja Pudotusvalikko

Valintaruudut, radiopainikkeet ja pudotusvalikot ovat yleisesti käytettyjä elementtejä erilaisissa lomakkeissa ja tietojenkeruujärjestelmissä. Ne mahdollistavat loppukäyttäjälle valinnan ennalta määritellyistä vaihtoehdoista. Käyttäjän valintojen perusteella voidaan esittää automaattisesti lisäkysymyksiä, jotka liittyvät juuri tehtyihin valintoihin.

Lyhyt kuvaus eri valintatyökalujen käytöstä

  • Valintaruutu (checkbox) sopii tilanteisiin, joissa käyttäjän halutaan voivan valita useita vaihtoehtoja samanaikaisesti.

  • Radioryhmä (radio button) on paras valinta, kun käyttäjän tulee valita vain yksi vaihtoehto ja vaihtoehtojen määrä on rajallinen.

  • Pudotusvalikko (dropdown) sopii tilanteisiin, kun käyttäjän tulee valita yksi vaihtoehto suuremmasta vaihtoehtojoukosta, esimerkiksi pitkältä listalta.

Artikkelin lopusta löydät lisätietoa valintatyökalujen eri ominaisuuksista: Valinnat, Hae valinnat, Logiikka ja Validoinnit.

Valintaruutu

Valintaruutua käytetään, kun käyttäjän tulee valita yksi tai useampia ennalta määritettyjä vaihtoehtoja. Se sopii erityisesti tilanteisiin, joissa kyllä/ei-vastaukset eivät riitä, vaan tarvitaan useampia valintoja. Valintaruutu koostuu pienestä neliöstä, joka voidaan ruksata valinnan merkiksi.

Jos vaihtoehtoja on paljon mutta vain yksi saa olla valittuna, pudotusvalikko voi olla valintaruutua sopivampi ratkaisu.

image-20240115-102832.png
Valintaruutu lomake-editorissa.

Vaihtoehtojen ominaisuuksia

  • Näytä kommenttikenttä: Valintaruutujen lisäksi vastausvaihtoehtojen alle voi lisätä kommenttikentän valitsemalla työkalun ominaisuuksissa välilehdeltä Yleistä -> Näytä kommenttikenttä.

Valintaruutu_nayta_kommenttikentta.png
Kommenttikenttä lisättynä lomakkeelle.

 

  • Näytä “Muu” -vaihtoehto: Tämä toiminto lisää lomakkeelle "Muu" -valintaruudun. Kun vastaaja valitsee tämän vaihtoehdon, hänelle näytetään kommenttikenttä, johon voi kirjoittaa vastauksen.

  • Näytä “Ei mikään” -vaihtoehto: Tämä lisää vaihtoehdon, joka mahdollistaa kysymykseen vastaamisen valitsemalla "Ei mikään edellä olevista". Tämä on hyödyllinen, kun halutaan vaatia vastaus, mutta mikään annetuista vaihtoehdoista ei sovi.

  • “Valitse kaikki” -toiminto: Tämä ominaisuus valitsee automaattisesti kaikki vastausvaihtoehdot kysymykseen, jos se on aktivoitu.

Valintaruutu_nayta_muut_vaihtoehdot.png

Sommittelu ominaisuuksia

  • Sarakkeiden määrä: Voit vaikuttaa vaihtoehtojen sijoitteluun lomakkeella säätämällä sarakkeiden määrää. Kun sarakkeita on yksi, vaihtoehdot näytetään allekkain. Määrittämällä sarakkeiden määräksi esimerkiksi kolme, vaihtoehdot sijoittuvat vierekkäin kolmeen sarakkeeseen – edellyttäen, että vaihtoehtoja on vähintään kolme.

image-20240115-104426.png
Sarakkeita lisäämällä saat vaihtoehdot asetettua lomakkeelle vierekkäin.

Data ja Validointi

  • Oletusarvo: Voit määrittää yhden vaihtoehdoista oletusarvoksi (Data-välilehti). Tällöin kyseinen vaihtoehto näkyy valmiiksi valittuna lomakkeen käyttäjälle.

Data_Oletusarvo.png
Oletusarvon asettaminen
  • Vastausten määrä: Jos haluat rajoittaa, kuinka monta vaihtoehtoa käyttäjä voi valita, voit määritellä valintojen vähimmäis- ja enimmäismäärän Validointi-osiossa.

image-20240115-104915.png
Vastausten määrän rajoittaminen

Muut validointiominaisuudet toimivat samalla tavalla kuin muissa monivalintatyökaluissa. Voit lukea niistä tarkemmin artikkelista: Työkalun validointi.

Lisää ominaisuuksia alempana, klikkaa tästä!

Radio-ryhmä

Radio-ryhmää käytetään, kun halutaan, että käyttäjä valitsee vain yhden ennalta määritellyn vaihtoehdon.

image-20240116-075750.png
Radioryhmä työkalu lomake-editorissa.

Ensimmäisen valinnan jälkeen valintaa ei saa pois — ellei valittaviin ole lisätty erillistä "Tyhjennä valinta" -vaihtoehtoa. Vaikka valintaa voi muuttaa, jokin vaihtoehto pysyy aina valittuna. Tämä voi aiheuttaa haasteita loppukäyttäjälle, jos kysymys ei ole pakollinen, mutta hän ei kuitenkaan halua vastata siihen.

Ominaisuuksia:

  • Sarakkeiden määrä: Sommittelu-välilehdellä sarakemäärän avulla voi vaikuttaa, miten vaihtoehdot sijoittuvat lomakkeella.
    Esimerkiksi:

    1 sarake = vaihtoehdot allekkain

    4 saraketta = 4 vaihtoehtoa vierekkäin

  • Oletusarvo: Voit määrittää yhden vaihtoehdoista oletusarvoksi (Data-välilehti). Tämä vaihtoehto näkyy valmiiksi valittuna lomakkeella, kun käyttäjä avaa sen.

Lue lisää ominaisuuksista klikkaamalla tästä!

Pudotusvalikko

Pudotusvalikko on työkalu, joka esittää luettelon vaihtoehdoista, joista käyttäjä voi valita yhden. Se säästää tilaa lomakkeella, sillä kaikki vaihtoehdot eivät ole näkyvissä yhtä aikaa.

Pudotusvalikkoa käytetään erityisesti silloin, kun valintavaihtoehtoja on paljon ja käyttäjän on tarkoitus valita vain yksi vaihtoehto.

image-20240116-081110.png
Pudotusvalikko lomake-editorissa

Ominaisuudet:

  • Paikkamerkki: Voit lisätä paikkamerkkitekstin pudotusvalikon kenttään (Yleistä-välilehti). Jos et määrittele omaa tekstiä, oletustekstinä käytetään sanaa “Valitse”.

image-20240116-081508.png

 

 

image-20240116-081647.png

 

.

  • Oletusarvo: Voit määrittää yhden vaihtoehdoista oletusarvoksi (Data-välilehti). Tällöin loppukäyttäjälle näytetään valmiiksi valittuna kyseinen vaihtoehto paikkamerkin sijaan.

  • Oma vaihtoehto: Käyttäjä voi valita pudotusvalikosta myös oman vaihtoehtonsa (Valinnat-välilehti). Tällöin valikon alle ilmestyy kommenttikenttä, johon voi kirjoittaa lisätietoa. Omalle vaihtoehdolle voi määrittää sekä näkyvän tekstin että paikkamerkin.

image-20240116-082207.png
  • Autogenerointi: Lukujen automaattinen generointi nopeuttaa työskentelyä silloin, kun valintalista perustuu numeroihin (Valinnat-välilehti). Voit asettaa pienimmän ja suurimman arvon sekä määrittää välin, jonka mukaan vaihtoehdot luodaan.
    Esimerkki: Jos määrität pienimmäksi luvuksi 0, suurimmaksi 10 ja väliksi 1, muodostuu listalle seuraavat vaihtoehdot: 0, 1, 2, 3, ..., 10.

 

 

image-20240116-082436.png
Editorinäkymä

 

image-20240116-082727.png
Lomakenäkymä

 

 

Valintatyökalujen yhtenäiset ominaisuudet ja asetukset

Valinnat

Kaikille valintatyökaluille yhteinen ominaisuus on vastausvaihtoehtojen määrittely. Vaihtoehdot voidaan asettaa työkalun ominaisuuksissa kohdassa Valinnat. Lisäksi vastausvaihtoehtojen tekstejä ja valintoja voidaan muokata suoraan editorissa.

image-20240116-085500.png
Voit valita, muokkaatko vaihtoehtoja editorissa (vasen puoli) vai ominaisuuksissa (oikea puoli). Ominaisuuksissa voit määrittää vaihtoehdoille laajemmin taustatietoja kuin editorissa. Esimerkiksi logiikan lisääminen vaihtoehdon taustalle onnistuu vain ominaisuuksissa.

Ominaisuudet

Lisää uusi vaihtoehto

image-20240116-083025.png

 

Lisää uusi vaihtoehto: ominaisuudet ja editori-ikkuna klikkaa “+”.

Pikasyöttö

image-20240116-083508.png

 

Pikasyöttö: Voit syöttää vaihtoehdot muodossa pelkkä arvo tai arvo ja teksti erottamalla ne
|-merkillä.

Esimerkkejä:

1|Yksi
2|Kaksi
3|Kolme

Jos kirjoitat vain arvon (esim. 1), sitä käytetään sekä arvona että näkyvänä tekstinä.

Tyhjennä

image-20240116-084808.png

 

Tyhjennä: Voit tyhjentää kaikki vaihtoehdot listalta.

Muuta

image-20240116-083718.png

Muuta: Painike avaa näkymän, jossa voit määrittää vaihtoehdon logiikan, kuten milloin se on näkyvissä tai aktiivinen.

Arvo

image-20240116-083803.png

 

Lomakedatassa näytettävä arvo vaihtoehdolle.

Arvo: Voi olla täysin eri teksti, kuin itse lomakkeella näytettävä teksti.

Teksti

image-20240116-083821.png

 

Teksti: Vaihtoehtoinen teksti, joka näytetään lomakkeella Arvon sijasta.

  • Jos tekstiä ei ole määritetty, näytetään vaihtoehdon arvo lomakkeella.

  • Jos sekä teksti, että arvo on määritetty, näytetään teksti lomakkeella ja arvo lomakedatassa

Järjestyksen muuttaminen

image-20240116-084243.png

 

Järjestyksen muuttaminen: Järjestyksen muuttaminen onnistuu helposti vetämällä ja pudottamalla – tartu vaihtoehdon vieressä oleviin pisteisiin ja raahaa se haluttuun kohtaan.

.Suodatus

Voit määrittää vaihtoehtojen järjestyksen valintojen suodatuksella.

image-20240116-084606.png

 

Annettu/Ei mitään:

Editorissa annettu järjestys.

Nouseva:

Aakkos-/numerojärjestys nousevasti.

Laskeva:

Aakkos-/numerojärjestys laskevasti.

Satunnainen:

Arvottu järjestys sattumanvaraisesti.

.

Hae valinnat

Hae Valinnat -toiminnon käyttäminen

Hae Valinnat -toiminnon avulla voit tuoda valintoja ulkoisesta tietolähteestä lomakkeelle. Toiminnon käyttö etenee seuraavasti:

  • Määritä tietolähde: Valitse ensin, mistä tietolähteestä valinnat haetaan. Tietolähde voi olla esimerkiksi tietokanta, ulkoinen palvelu tai muu tietojärjestelmä.

  • Laadi kysely: Seuraavaksi määritellään kysely, jolla haettavat tiedot noudetaan valitusta tietolähteestä. Kyselyn rakenne riippuu käytetystä tietolähteestä.

  • Määritä kentät: Kun tiedot on haettu, määritä, mitä kenttiä käytetään lomakkeella näytettävien valintojen muodostamiseen. Esimerkiksi valikkoon voidaan näyttää tietyn kentän arvot.

  • Liitä Valinnat kysymykseen: Lopuksi liitä haetut valinnat haluttuun kysymystyyppiin, kuten pudotusvalikkoon tai matriisikysymykseen.

Kun nämä vaiheet on suoritettu, lomakkeella näytetään valinnat suoraan ulkoisesta tietolähteestä. Käyttäjä voi valita niistä sopivan vaihtoehdon.

image-20240116-084650.png

 

URL:

Julkinen URL-osoite, johon listattavat vaihtoehdot on julkaistu. Esimerkki JSON muodossa: https://formbox.fi/demo/alternatives.json

Polku:

Polku JSON-rakenteessa listattaviin vaihtoehtoihin. Ylläolevan URL-esimerkin osalta polku on “fi”.

Arvon nimi:

Vaihtoehtojen arvon nimi JSON-rakenteessa. Ylläolevan URL esimerkin osalta arvon nimi on “code”

Otsikon nimi:

Vaihtoehtojen otsikon nimi JSON-rakenteessa. Ylläolevan URL esimerkin osalta otsikon nimi on “name”

Salli tyhjä vastaus:

Sallitaanko kysymyksessä tyhjä vastaus

Testaa palvelua:

Pudotusvalikko esittää URL-osoitteen pohjalta tuodut vaihtoehdot, kun yllä olevat määritykset on oikein asetettu.

Esimerkki "Hae Valinnat" -toiminnallisuudesta valintaruudussa

Oletetaan, että lomakkeessa on kaksi valintaruutua: "Tuoteryhmä" ja "Tuote". Käyttäjän tulee ensin valita tuoteryhmä, jonka perusteella "Hae Valinnat" -toiminto hakee kyseiseen tuoteryhmään liittyvät tuotteet ulkoisesta lähteestä (esim. tietokannasta tai API-rajapinnasta) ja näyttää ne "Tuote"-valintaruudussa.

Tämän ansiosta lomake päivittyy dynaamisesti käyttäjän valintojen mukaan. Käyttäjä näkee aina ajantasaiset vaihtoehdot.

Käyttöesimerkki:

Käyttäjä valitsee "Elektroniikka" tuoteryhmäksi.

"Hae Valinnat" ominaisuus hakee kaikki "Elektroniikka"-tuoteryhmään kuuluvat tuotteet.

"Tuote"-valintaruutu päivittyy näyttämään nämä tuotteet.

Tämä toiminto on erityisen hyödyllinen tilanteissa, joissa käyttäjälle halutaan tarjota joustavia ja dynaamisia valintoja, jotka muuttuvat muiden valintojen perusteella.

 

Logiikka

Kaikilla valintatyökaluilla on yhteneväiset ominaisuudet lomakelogiikan määrittelyyn.
Yleisiä määritelmiä ovat:

  • Näkyvä, jos

  • Aktiivinen, jos

  • Pakollinen, jos

  • Oletusarvon lauseke

Näiden määritelmien tarkemmat kuvaukset ja esimerkit löydät artikkelista: Työkalujen logiikka ominaisuudet.

image-20240119-105250.png
Valintatyökalujen ominaisuuksia lomake-editorissa

 

Valintatyökalujen logiikkaominaisuuksia

Valintatyökaluissa voidaan hyödyntää erilaisia logiikkasääntöjä, joiden avulla lomake mukautuu käyttäjän valintojen perusteella. Alla on kuvattu tärkeimmät logiikkaominaisuudet:

Piilota kysymys, jos se ei sisällä vaihtoehtoja

Jos kysymykseen liittyville vaihtoehdoille on määritetty vaihtoehtokohtaisia logiikoita, ja kaikkien vaihtoehtojen näkyvyys estyy logiikan perusteella, koko kysymys piilotetaan automaattisesti.

Vaihtoehdot näkyvät, jos

Tällä logiikalla voidaan määrittää, milloin tietyt vaihtoehdot tulevat näkyviin tai menevät piiloon lomakkeella. Ehto määritellään niin, että kun tietty toteamus toteutuu, halutut kysymykset joko näytetään tai piilotetaan käyttäjältä.

Vaihtoehdot aktiiviset, jos

Tämä logiikka mahdollistaa vaihtoehtojen asettamisen aktiiviseksi tai inaktiiviseksi ehtojen perusteella. Kun määritetty ehto toteutuu, vaihtoehto voidaan ottaa käyttöön (aktiiviseksi) tai estää (inaktiiviseksi), olettaen että kysymys näytetään.

Esimerkki valintatyökalujen käytöstä logiikan kanssa:

Oletetaan, että luodaan lomake tapahtuman ruokailuvalintojen keräämiseen. Käyttäjä voi valita osallistumisensa eri ruokavaihtoehtoihin valintaruutujen avulla.

Tapahtumaruokailun Valinta:

Vaihtoehto 1: Kasvisruoka

Vaihtoehto 2: Kala

Vaihtoehto 3: Liha

Valintoihin liittyvä logiikka:

Jos käyttäjä valitsee "Kasvisruoka", näytetään lisäkysymys:

"Haluatko lisäksi kalaa annokseen?"

Valintaruutu: "Kyllä" tai "Ei"

Jos käyttäjä valitsee "Kala", näytetään lisäkysymys:

"Haluatko kanttarellikastiketta kuhalle?"

Valintaruutu: "Kyllä" tai "Ei"

Jos käyttäjä valitsee "Liha", näytetään lisäkysymys:

"Lihan kypsyysaste?"

Valintaruutu: "Medium -", "Medium +" tai "Well done"

Lisäksi kun käyttäjä valitsee "Kasvisruoka", "Kala" tai "Liha", näytä seuraava kysymys:

"Haluatko lisätä juomat?"

Pudotusvalikko: "Valitse juoma" (vaihtoehdot: vesi, limsa, viini)

Tämän logiikan avulla lomake mukautuu dynaamisesti käyttäjän valintojen perusteella. Näin varmistetaan, että käyttäjälle näytetään vain olennaiset lisäkysymykset, mikä parantaa käyttökokemusta ja tekee lomakkeesta selkeän ja tarkoituksenmukaisen.

Validoinnit

Yhtenäiset validointityökalut kaikille kolmelle valintatyökalulle:

image-20240116-091923.png

 

Virheviesti pakollinen:

Jos kysymys on merkitty pakolliseksi ja käyttäjä yrittää lähettää lomakkeen ilman vastausta, näytetään kentän yläpuolella virheviesti. Esimerkiksi:

Tämä kenttä on pakollinen.

Validointi on mahdollista toteuttaa toteamuksella. Valintaruutu-kentässä on myös mahdollista tarkastaa valintaruutujen määrä.

Validointi

image-20240119-105706.png

 

Valintatyökaluille voidaan määrittää seuraavat validoinnit:

Toteamus (lauseke): Mahdollistaa ehdollisen validoinnin perustuen käyttäjän valintoihin.

Vastausten määrä (valintaruutu): Mahdollisuus tarkistaa, kuinka monta vaihtoehtoa on valittu (esim. vähintään 1, enintään 3).

Tyhjä kommentti - virhesanoma:

Jos käyttäjä valitsee "Muu"-vaihtoehdon, mutta ei kirjoita selventävää kommenttia, näytetään erillinen virheviesti. Tähän voi määrittää mukautetun virhesanoman, esimerkiksi:

Kirjoita selvennys, jos valitsit "Muu".

Aiheeseen liittyvät artikkelit: