UI:Kassid

Allikas: Lambda
Leht kuulub aine Kasutajaliidesed juurde.
Catsplosion!
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). Võimalik on kasutada ka dijkstra serverit, kuhu sobivad samuti teie klassikasutajad ja kus samuti on tarvis kasutada suurti 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)