Smartninja JavaScript primer

Počitnice!

by Gregor Z.

HTML

<p>
  <strong>Država:</strong>
  <br>
  <input type="radio" name="drzava" value="sl" onclick="izberiDrzavo('sl');" checked> Slovenija<br>
  <input type="radio" name="drzava" value="hr" onclick="izberiDrzavo('hr');"> Hrvaška<br>  
</p>

<p>
<strong>Mesto:</strong>
<select id="hr-morje">  
  <option >Rijeka</option>
  <option >Zadar</option>
  <option >Dubrovnik</option>
</select>

<select id="sl-morje">
  <option >Piran</option>
  <option >Koper</option>
  <option >Ankaran</option>
</select>
</p>

<p>
  <input id="checkbox" type="checkbox"/> Strinjam se s pogoji poslovanja<br>
</p>

<button onclick="rezerviraj();">Rezerviraj</button>

CSS

body {
  font-family: arial;
  font-size: 12px;
}

#hr-morje {
  display: none;
}

JavaScript

function izberiDrzavo(drzava) {

	var slMorje = document.getElementById("sl-morje");
  var hrMorje = document.getElementById("hr-morje");

    if (drzava === 'hr') {
    	slMorje.style.display="none";
      hrMorje.style.display="inline";
    } else if (drzava === 'sl') {
    	hrMorje.style.display="none";
      slMorje.style.display="inline";
    }    
}

function rezerviraj() {
	var pogoji =  document.getElementById("checkbox");
	if (pogoji.checked) {
  	alert('Prijetne počitnice!');
  } else {
  	alert('Morate se strinjati s pogoji.')
  }
  
}