UI:Kassid: erinevus redaktsioonide vahel
| 7. rida: | 7. rida: | ||
Ehitage vormiväli, millest kasutaja saab süsteemile saata kassi nime ja sünniaasta. | Ehitage vormiväli, millest kasutaja saab süsteemile saata kassi nime ja sünniaasta. | ||
* Kontrollige, et kassi nimi ja sünniaasta oleksid mõistlikud | * Kontrollige, et kassi nimi ja sünniaasta oleksid mõistlikud: | ||
** Nimi pole tühi | ** Nimi pole tühi. | ||
** Sünniaasta | ** Sünniaasta oleks aastaarv, mis poleks tulevikus ega üle 50 aasta tagasi). | ||
** Vea korral andke kasutajale tagasisidet | ** Vea korral andke kasutajale tagasisidet. | ||
** Tagage, et "enter" saadab vormi. | ** Tagage, et "enter" saadab vormi. | ||
** Soovi korral: võimaldage mitme kassi mugavalt lisamine. | ** Soovi korral: võimaldage mitme kassi mugavalt lisamine. | ||
Redaktsioon: 3. märts 2016, kell 07:58
| Leht kuulub aine Kasutajaliidesed juurde. |

Kujutage ette, et ehitate programmi kasse pidava vanainimese kasside üle arve pidamiseks.
Ülesanne
Tehke töö paaris. Harjutame vormiväljade saatmise simuleerimist. Kuna täna huvitab meid saatmise loogika ja javascript — täna kujundage minimaalselt või üldse mitte. Testimiseks kasutan Firefoxi, seega võiksite kontrollida, et teie lahendus selle peal töötab.
Ehitage vormiväli, millest kasutaja saab süsteemile saata kassi nime ja sünniaasta.
- Kontrollige, et kassi nimi ja sünniaasta oleksid mõistlikud:
- Nimi pole tühi.
- Sünniaasta oleks aastaarv, mis poleks tulevikus ega üle 50 aasta tagasi).
- Vea korral andke kasutajale tagasisidet.
- Tagage, et "enter" saadab vormi.
- Soovi korral: võimaldage mitme kassi mugavalt lisamine.
Lisaülesanne: Ehitage lehekülg, millele kasutaja satub pärast nime ja sünniaasta sisestamist. Sellel leheküljel võiks olla kas:
- Kasside nimekiri (kasutaja sisestatud sissekanne "tähistatud").
- Nimekiri laadige json stringist (lisatud kass ei pea seal kajastuma).
- Sisestatud info
- Ei pea olema sama info, mis sisestati: lihtsalt tagasiside ning muu navigatsiooni näitamiseks
Lisainfot
Enter vormiväljal tekitab "submit" eventi, mis tähendab seda, et kui vormivälja saatmise teete mingil põhjusel onclick atribuudiga mõnel elemendil — nupul või lingil, on tark sama funktsiooni korrata elemendi form onsubmit sündmusena.
<form id="form" action="" onsubmit="return true"> <!-- return false tähendaks, et vormi ei saadeta; asendage töötleva funktsiooniga --> <!-- (nt return handleForm() ) mis vaatab andmete korrektsust ja vastavalt kas võtab --> <!-- vormi vastu või mitte --> <input name="nimi" type="text" /> <input type="submit" value="saada"/> </form>
Esitamine
- Salvestage töö arvutiklassi W: kettale või veebi.
- Saatke e-post jaagup.irve@ttu.ee aadressil, mille teemarida on "UI:Kassid" (mis on oluline, sest sortimine!), ning milles on teie töö aadress.
NB: Arvutiklasside veebiketastel leiduv on nähtav aadressil: http://www.tud.ttu.ee/web/Teie.Kasutajanimi/ ja vajab index.html faili (ning ärge unustage suuri tähti). Hindamise sissekandmisel on kasu ka ka autorite nimedest!
Boonus
- Wat - Javascript on üks loogiline keel (kahjuks ka üsna vältimatu, seega tasub seda loogilisust mitte ülemäära põdeda; elate kauem)