Viikkotehtävä 7 - Ajax
Toteutaan Ajaxin avulla treenitietokanta.
Yhteiset vaatimukset:
- Luo ensin resepti.sql-tiedoston avulla SQLite-tietokanta. Katso myös relaatiokuva.
- Ensimmäinen ladattava sivu on oltava valmiiksi annettu staattinen XHTML Strict -dokumentti. Sitä ei saa luoda Pythonin avulla. Dokumentti linkitetään erillisiin JavaScript-tiedostoihin.
- Muotoilut pitää pyrkiä tekemään erillisellä CSS-tiedostolla.
- JavaScript-tiedosto saa XMLHttpRequest-olion avulla kutsua Python-skriptejä.
- JavaScriptissä on käytettävä standardinmukaisia operaatioita (EcmaScript, W3C DOM, W3C XMLHttpRequest) aina kun se on mahdollista.
- Selaimien yhteensopivuusapuna saa käyttää jQuery- tai Prototype-kirjastoa. Riittää kuitenkin, että sovellus toimii Firefox 3 -selaimessa.
- Käytetään ISO-8859-1-merkistöä.
- Tietokantaan ei saa tehdä vaatimusten vastaisia lisäyksiä, vaikka joku onnistuisi kiertämään Ajaxilla tehdyt ennakkotarkistukset.
Taso 1
Tee viikkotehtävä 5 / taso 1 mukainen reseptitietokantasovellus käyttäen ajaxia seuraavalla tavalla:
- Ruokalajit on haettava Ajax-operaationa, joka kutsuu mod_python-ohjelmaa. mod_python-ohjelma hakee ruokalajit tietokannasta. Vaihtoehdot on haettava sivun latauksen yhteydessä ja liitettävä sivuun DOM-rajapinnan kautta.
- Jos käyttäjä syöttää reseptille nimen, joka on jo käytössä niin tästä tulee virheilmoitus kentästä poistuttaessa. Reseptin nimen tarkistus tehdään Ajax-operaationa aina, kun käyttäjä siirtyy pois nimikentästä.
- Tallenna-painike on epäaktiivinen, kunnes lomakkeeseen on syötetty kelvolliset tiedot eli reseptille nimi, kuvaus, kelvollinen henkilömäärä (positiivinen kokonaisluku), valittu ruokalaji ja kirjoitettu vähintään yksi reseptin vaihe.
- Reseptin tallentamista ei tarvi tehdä ajax-operaationa vaan se voidaan tallentaa perinteiseen tapaan.
Taso 3
Laajenna taso 1 vastaamaan viikkotehtävä 5 / taso 3 -vaatimuksia
- Ruoka-aineet ja yksiköt on haettava Ajax-operaationa sivun latauksen yhteydessä.
- Uusi ruokalaji lisätään ajaxilla heti kentästä poistuttaessa. Jos ruokalaji on jo olemassa niin virheestä ilmoitetaan samaan tapaan kuin viikkotehtävässä 5.
- Virheistä tai puutteista ilmoitetaan samalla tavalla kuin viikkotehtävässä 5 eli virheellinen kenttä värjätään punaisella ja vieressä kerrotaan tekstinä virheestä tai puutteesta. Virhetarkistus tehdään aina heti kentästä poistuttaessa.
- Reseptin vaiheiden syöttämistä varten on aluksi tarjolla vain yksi kenttä eikä kymmenen kenttää kuten viikkotehtävässä 5. Kentästä poistuttaessa luodaan automaattisesti uusi tyhjä kenttä mahdollista seuraavaa vaihetta varten. Tarjolla on siis aina yksi tyhjä kenttä vaiheen syöttämistä varten. Reseptiin täytyy liittyä vähintään yksi vaihe.
- Aineiden lisäämiseen on tarjolla aluksi vain yksi rivi (määrä, yksikkö ja aine). Uusi ainerivi lisätään sivulle automaattisesti heti kun ensimmäinen ainerivi on oikein täytetty. vrt. vaiherivien luominen. Virheet tarkistetaan heti kentästä poistuttaessa samaan tapaan kuin tasolla 1. Reseptiin täytyy liittyä vähintään yksi aine.
- Myös reseptin tallentaminen tehdään Ajax-operaationa. Tallentamisen jälkeen sivun alaosassa annetaan reseptilistaus.
Taso 5
Laajenna taso 3 vastaamaan viikkotehtävä 5 / taso 5 -vaatimuksia. Kaikki toimenpiteet tapahtuvat ajaxilla koko ajan samalla sivulla pysyen ja lataamatta sivua uudelleen.
- Kaikkiin Ajax-operaatioihin (lisäys, poisto, tallennus) pitää liittää jokin selkeä latausindikaattori, jota näytetään kunnes operaatio on suoritettu.
- Listaus resepteistä haetaan näkyviin heti, kun sivulle tullaan.
- Reseptin tallentamisen jälkeen voi reseptiä edelleen muokata ja tallentaa sen uudelleen, jolloin se korvaa edellisen tallennuksen.
- Reseptin poistaminen pitää varmistaa erillisellä dialogilla.
- Lisää reseptin vaiheiden ja ainerivien perään ruksi (checkbox), jolla voi helposti poistaa kyseisen vaiheen tai ainerivin.
Käyttäjien kommentit