Select och lager

Har en selectruta där jag listar olika namn. Varje namn har ett värde och vill ha så när man väljer namnet med ex värdet 1 så skall ett lager (<div>) komma fram nedanför. Hur skriver man sådant? Har sökt men hittar inte.. Vet ej vad jag skall söka på.

Exempel:

<script>
function showLayer(sel){
  var opts = sel.options,
      len  = opts.length,
      cur  = opts[sel.selectedIndex];

  for (var i = 0; i < len; ++i){
    var elm = document.getElementById("selLayer" + opts[i].value);

    if (elm){
      if (opts[i] == cur){
	elm.style.display = "block";
      } else {
	elm.style.display = "none";
      }
    }
  }
}
</script>

<select onchange="showLayer(this)">
  <option value="">-----------</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>

<div id="selLayer1" style="display:none">1</div>
<div id="selLayer2" style="display:none">2</div>

Supertack! FUnkade precis som jag ville!

Kompletterande fråga:
Kan man få det att visa två lager vid val i listrutan? Testade men fick bara framena lagret. Skall ha samma lagernamn!

Då får vi byta ut id mot t.ex. class, eftersom ett id måste vara unikt:

<script>
function showLayer(sel){
  var divs = document.getElementsByTagName("div"),
      dLen = divs.length;

  for (var i = 0; i < dLen; ++i){
    if (divs.item(i).className && new RegExp("^selLayer" + sel.options[sel.selectedIndex].value + "$").test(divs.item(i).className)){
      divs.item(i).style.display = "block";
    } else {
      divs.item(i).style.display = "none";
    }
  }
}
</script>

<select onchange="showLayer(this)">
  <option value="">-----------</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>

<div class="selLayer1" style="display:none">1</div>
<div class="selLayer1" style="display:none">1</div>
<div class="selLayer2" style="display:none">2</div>

Återigen tack :)

Vassego! :)

Sen en sista fråga hoppas jag! Om jag väljer dessa värdern så sidan laddas om vill jag att ex värdet 1 är valt och då skall lagret visas. Hur gör man detta?

window.onload = function(){
  showLayer(document.forms["namn_på_formulär"].elements["namn_på_select"]);
}

:)

Hmm, jag vet att när värdet är 1 så skall lagret synas. Kan jag skriva så gär då?

<script>
window.onload = function(){
  showLayer('1');
}
</script>

Var skall koden ligga på sidan? Nåt mer man skall lägga in? Jag fåt det inte att fungera så den visar det efter sidomladdning med ett formulär.

Så här får du göra:

<script>
function showLayer(){ ... }

window.onload = function(){
  var sel = document.forms["namn_på_formulär"].elements["namn_på_select"];

  if (sel.options[sel.selectedIndex].value == 1){
    showLayer(sel);
  }
}
</script>

Dessutom upptäckte jag några rester från det första kodförslaget, så jag har uppdaterat den senaste versionen.

:)