MVnet logo

Kotisivun teko » Lomakkeita peliin

  • Julkaistu: 20.10.2006
  • Päivitetty: 25.02.2009
  • Kommentit

Lomakkeita peliin

Vuorovaikutusta lomakkeilla

Käyttämällä nettisivulla lomakkeita, saa sivuille hieman vuorovaikutusta. Kävijät voivavat lomakkeiden avulla mm. tilata tuotteita (esim. verkkokaupat), muuttaa sivun sisältöä (esim. keskustelupalstat) jne. Mahdollisuuksia on monia. Tavallisimmin lomakkeita käytetään palautelomakkeina. Lomakkeen perusideana on, että kävijä täyttää lomakkeen kentät, jonka jälkeen hänen nettiselaimensa lähettää kenttien tiedot jollekin sivulle, johon sivuston ylläpitäjä on tehnyt ohjelman, joka osaa käsitellä lomakkeen tiedot. Se, mitä tämä lomakkeen käsittelijä tekee, riippuu paljon sen toteutuksesta. Lomakkeen tiedot voidaan lähettää vaikka ylläpitäjän sähköpostiin tai sitten tallentaa tiedostoon palvelimelle.

Lomakkeen käsittelijän pitää olla kirjoitettu jollain palvelinpuolen kielellä, kuten PHP tai CGI-skripti. HTML-kielellä et voi tehdä lomakkeen käsittelijää, koska HTML ei ole ohjelmointikieli. PHP:llä toteutetun palautelomakkeen käsittelijän löydät MVnetistä sivulta Palautelomake PHP:llä.

Lomakkeen rakenne ja kentät

Lomakkeissa on aina samanlainen perusrakenne, joka on seuraava:

<form method="post" action="lomakkeenKäsittelijänOsoite">
	<p>
	lomakkeen kenttiä ja kenttien selityksiä yms.
	</p>
</form>
	

Lomake siis alkaa <form>-tägillä, jossa on attribuutti method="post" (tarkoittaen, että lomake lähetetään jollekin sivulle). Form-tägin action-attribuutin arvoksi laitetaan lomakkeen käsittelijän osoite, johon siis selain sitten lähettää lomakkeen tiedot. Form-tägien sisään voi laittaa erilaisia lomakkeiden kenttiä ja kertoa, mitä kenttiin pitäisi täyttää. Lomakkeiden kenttiä on useita erilaisia: normaaleja yhden rivin tekstikenttiä, salasanakenttiä tai rasti ruutuun kenttiä jne.

Lomakkeiden kenttinä käytetään yleensä jotain seuraavista:

  • Lähetyskenttä (input type="submit") on painike, jota klikkaamalla lomake saadaan lähetettyä.
  • Tyhjennyskenttä (input type="reset") on painike, jota klikkaamalla lomakkeen kaikki kentät voidaan tyhjentää.
  • Piilokentät (input type="hidden") ovat kenttiä, joita käyttäjä ei itse voi muuttaa ja jotka eivät näy nettiselaimessa. Näitä käytetään välittämään lomakkeen käsittelijälle valmiiksi täytettyä dataa.
  • Tekstirivit (input type="text") ovat yhden rivin mittaisia kenttiä, joihin käyttäjä voi kirjoittaa rivin tekstiä.
  • Salasanakenttä (input type="password") on yhden rivin mittainen kenttä, johon käyttäjän on turvallista kirjoittaa salasana. Kentässä näkyy kirjoitetun merkin tilalla vain asteriksi (*), jolloin kukaan olan yli kurkkiva ulkopuolinen ei siis näe käyttäjän kirjoittamaa salasanaa tässä kentässä.
  • Tekstialueet (textarea) ovat kenttiä, joihin käyttäjä voi kirjoittaa useamman rivin tekstiä. Tekstialueen koon voi määrittää määritteillä rows (rivit) ja cols (sarakkeet). Tekstialuetta voi vierittää, jos kirjoitettuja rivejä on enemmän kuin tekstialueen koko on.
  • Tiedostokenttään (input type="file") käyttäjä voi valita tiedoston omalta koneeltaan, jonka hän haluaa lähettää lomakkeen mukana.
  • Valikkokentästä (select) käyttäjä voi valita vaihtoehtoja valmiiksi annetusta joukosta.
  • Valintanapit eli radio buttonit (input type="radio") ovat rasti ruutuun -kenttiä, joista käyttäjä voi valita haluamansa vaihtoehdon. Jos valintanappien kenttien nimiksi laitetaan samat nimet, voi käyttäjä valita näistä samannimisistä vaihtoehdoista vain yhden.
  • Valintaruudut (input type="checkbox") ovat myös rasti ruutuun -kenttiä, joista käyttäjä voi rastittaa haluamansa vaihtoehdot. Vaihtoehdoista voi valita useamman valinnan.

Alla on esitetty yksinkertainen esimerkki palautelomakkeesta:

<form method="post" action="lomakeKasittely.php">

	<input type="hidden" name="Tyyppi" value="Palaute" />

	<p>Nimesi: <input name="nimi" size="30" maxlength="50" /></p>

	<p>Palautteesi otsikko: 
	<input name="otsikko" size="30" maxlength="50" /></p>

	<p>Kirjoita palautteesi:<br />
	<textarea name="teksti" cols="70" rows="9">
	Kirjoita tekstisi tähän.</textarea>
	</p>

	<p><input name="vastaus" type="checkbox" value="vastataan" />
	Haluan, että palautteeseeni VASTATAAN.</p>

	<p>Sukupuoleni on: <br />
	<input type="radio" name="sukupuoli" value="mies" /> Mies<br />
	<input type="radio" name="sukupuoli" value="Nainen" /> Nainen
	</p>

	<p>
	<input type="submit" value="Lähetä" name="submit" />
	<input type="reset" value="Tyhjennä kentät" name="reset" />
	</p>

</form>
	

Koodi näyttää selaimessasi seuraavalta (lomaketta ei lähetetä millekään lomakkeen käsittelijälle):

Nimesi:

Palautteesi otsikko:

Kirjoita palautteesi:

Haluan, että palautteeseeni VASTATAAN.

Sukupuoleni on:
Mies
Nainen

Paljon lisää tietoa lomakkeista löytyy suomeksi Jyväskylän yliopiston julkaisusta WWW-lomakkeet. Lomakkeiden kenttien tarkistuksesta JavaScriptillä löytyy tietoa MVnetin sivulta JavaScript-ohjelmointi.

Ilmainen lomakkeenkäsittelijä

Jos käyttämässäsi palvelimessa ei ole mahdollista käyttää PHP-ohjelmointikieltä tai CGI-skriptejä on palautelomakkeen käsittelijään käytettävä jotain ulkopuolista palvelua. Tällaisen palvelun tarjoaa esimerkiksi suomenkielinen www.sivuille.net. Heidän palvelustaan löytyvän lomakkeenkäsittelijän avulla voi kuka tahansa tehdä helposti palautelomakkeen, jonka tiedot lähetetään ylläpitäjän sähköpostiin. Lomakkeenkäsittelijä toimii samalla periaatteella kuin, jos sinulla olisi esim. PHP:llä toteutettu oma lomakkeen käsittelijä omalla palvelimellasi. Nyt nettiselain ei lähetäkään lomaketta sinun palvelimesi lomakkeenkäsittelijälle vaan lomakkeen tiedot lähetetään www.sivuille.nettin ja he lähettävät lomakkeen tiedot eteenpäin sinun sähköpostiisi. Ohjeet palvelun käyttöönottoon löytyvät www.sivuille.netistä.

Anna kävijälle kuva, että palautteella voi vaikuttaa

Jos teet sivuillesi lomakkeella palautelomakkeen, on syytä antaa kävijälle sellainen kuva, että palautteita tosiaan luetaan ja niillä on jotain vaikutusta. Olet varmaan monesti itsekin miettinyt lähettää jollain lomakkeella palautetta, mutta olet jättänyt homman sikseen, koska luulet ettei palautteellasi olisi kuitenkaan mitään vaikutusta, jos sen joku ylipäätänsä edes lukee. Moni muukin voi ajatella näin, jolloin arvokkaita palautteita saattaa jäädä lähettämättä.

Esimerkiksi MVnetissä on Palaute -sivulle listattu muutamia kävijöiden lähettämiä palautteita ja kerrottu, minkälainen vaikutus palautteilla on ollut. Jos joku epäröi lähettää palautetta, saattaa hän rohkaistua lähettämään palautetta, jos hän näkee, millainen vaikutus muiden ihmisten lähettämillä palautteilla on.

Muista myös vastata palautteisiin, jos niissä vastausta pyydetään ja mieluummin mahdollisimman pikaisesti. Palautteeseen vastaaminen vasta parin viikon sisällä ei anna kovin hyvää kuvaa sivustosta. Kaikenlaiseen kritiikkiin kannattaa myös suhtautua asiallisesti. Jos joku haukkuu sivustosi lyttyyn palautteessaan, älä vastaa tähän haukkumalla lähettäjää. Pyydä lähettäjää mieluummin luettelemaan tarkemmin, mitä sivustossa pitäisi parantaa. Asiattomiin viesteihin kannattaa mieluummin jättää vastaamatta.

Seuraava sivu (Ulkoasu kotisivuille) >> << Edellinen sivu (Kuvia kotisivuille)

Sivun kommentit