Tulos

Lomakkeella selvitetään viikonpäivä, esimerkiksi oma syntymäpäivä tai joku tuleva tapahtuma. Mikä tahansa päivämäärä välillä 1.3.1900 - 31.12.9999 kelpaa.

Koodi

Tämä tulee HEAD-osastoon

<script type="text/javascript">
function SelvitaViikonPaiva(form) {

// Sijoitetaan lomake-elementit muuttujaan
// lyhentämään koodia ja vähentämään viittauksia olioihin:

var Lomakealkiot = document.forms["VPlomake"].elements;

// Kerätään lomakesyöte ao. muuttujiin:

var Paiva = Lomakealkiot["Paivat"].value;
var Kuukausi = Lomakealkiot["Kuukaudet"].value;
var Vuosi = Lomakealkiot["Vuodet"].value;

/* Vuosilukutarkistukset alkavat */

 if (isNaN(Vuosi)) { //onko syötetty numeroita?
 alert("Tarkista syöte. Vuosiluku koostuu neljästä numerosta.");
 return;
 }
 else if (Vuosi.length != 4) { //onko syötetty 4 numeroa?
 alert("Syötä vuosiluku nelinumeroisena.");
 return;
 }

/* Vuosilukutarkistukset loppuvat */

// Kasataan syöte yhteen muuttujaan: 

var KoottuSyote = Vuosi + "," + Kuukausi + "," + Paiva;

// Luodaan syötteen mukainen päivämääräolio:

var Silloin = new Date(KoottuSyote);

/* Päivämäärätarkistukset alkavat */

// Asetetaan aikaraja (1900-03-01),
// jota aikaisempia päivämääriä ei hyväksytä. 

var Aikaraja = new Date(1900,2,1);

// Verrataan olioita toisiinsa:

 if (Aikaraja > Silloin) {
 alert("Sorry, hyväksyn päivämääriä vain 1.3.1900 alkaen.");
 return;
 }

// Haetaan päivän järjestysnumero (kuukausisuhteessa):

var KuukaudenPaivaNumero = Silloin.getDate();

// Ja tarkistetaan syötetyn päivämäärän pätevyys,
// eli eliminoidaan 31.02. päivämäärät yms. 

 if (Paiva != KuukaudenPaivaNumero) {
 alert("Sorry, en löydä kalenteristani tuota päivämäärää.");
 return;
 }

/* Päivämäärätarkistukset loppuvat */

// Haetaan päivän järjestysnumero (viikkosuhteessa):

var ViikonPaivaNumero = Silloin.getDay();

// Luodaan viikonpäivätaulukko:

var ViikonPaivat = [];
ViikonPaivat[0]="sunnuntai";
ViikonPaivat[1]="maanantai";
ViikonPaivat[2]="tiistai";
ViikonPaivat[3]="keskiviikko";
ViikonPaivat[4]="torstai";
ViikonPaivat[5]="perjantai";
ViikonPaivat[6]="lauantai";

// Sijoitetaan järjestysnumeroa vastaava teksti muuttujaan:

var SePaiva = ViikonPaivat[ViikonPaivaNumero];

// Luodaan funktio lisäämään tarvittaessa etunollan
// tulostettavan sanoman kuukauteen ja päivämäärään: 

function EtuNollat(numero) {
var inkluusio = "";
 if (numero < 10) {
 inkluusio += "0";
 }
 return inkluusio + numero.toString();
}

// Luodaan muuttuja ja sijoitetaan siihen syötteen
// mukainen päivämäärä ISO 8601 -muodossa
// (vvvv-kk-pp) tulostusta varten:

var TulostettavaPVM = Silloin.getFullYear() + "-";
TulostettavaPVM += EtuNollat(Silloin.getMonth() +1) + "-";
TulostettavaPVM += EtuNollat(KuukaudenPaivaNumero);

// Luodaan nykyhetken mukainen pävämääräolio,
// jotta nähdään onko syötetty päivämäärä menneisyydessä:

var Tanaan = new Date();

// Nollataan tämän päivän kellonaika vertausta varten:

Tanaan.setHours(0,0,0,0);

// Verrataan olioita toisiinsa ja tulostetaan verbi
// oikeassa aikamuodossa:

var Aikamuoto = Tanaan <= Silloin ? " on " : " oli ";

alert(TulostettavaPVM + Aikamuoto + SePaiva + ".");
}
</script>

Tämä tulee BODY-osastoon

<form name="VPlomake" id="VPlomake" action="">
<table border="1" cellpadding="4" cellspacing="2">
<tr>
<th colspan="3">Mikä viikonpäivä on kyseessä?</th>
</tr>
<tr>
<th>Valitse päivä</th>
<th>Valitse kuukausi</th>
<th>Syötä vuosiluku</th>
</tr>
<tr>
<td>
<select name="Paivat" id="Paivat">
<option value="1">01</option>
<option value="2">02</option>
<option value="3">03</option>
<option value="4">04</option>
<option value="5">05</option>
<option value="6">06</option>
<option value="7">07</option>
<option value="8">08</option>
<option value="9">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
</td>
<td>
<select name="Kuukaudet" id="Kuukaudet">
<option value="January">Tammikuu</option>
<option value="February">Helmikuu</option>
<option value="March">Maaliskuu</option>
<option value="April">Huhtikuu</option>
<option value="May">Toukokuu</option>
<option value="June">Kesäkuu</option>
<option value="July">Heinäkuu</option>
<option value="August">Elokuu</option>
<option value="September">Syyskuu</option>
<option value="October">Lokakuu</option>
<option value="November">Marraskuu</option>
<option value="December">Joulukuu</option>
</select>
</td>
<td>
<input
 name="Vuodet"
 id="Vuodet"
 size="4"
 maxlength="4" /> (4 lukua)
</td>
</tr>
<tr>
<td colspan="3" align="center">
<input type="button"
 value="Selvitä viikon paiva."
 onclick="SelvitaViikonPaiva(this.form)" />
</td></tr>
</table>
</form>

Tämä sivu kuuluu vaikeimpiin JavaScript-esimerkkeihin.