Avatar billede spm Nybegynder
07. april 2009 - 15:43 Der er 6 kommentarer og
1 løsning

når bestemte værdier fra <SELECT> vælges skal der vises to nye felter

Hej.
Jeg har en simpel form.
<select name=navn>
<option value=a>a</option>
<option value=b>b</option>
<option value=c>c/option>
<option value=d>d</option>
<option value=e>e</option>
</select>

Det hvad jeg er ude efter er, at når "d" og "e" vælges så skal der  automatisk vises yderligere 2 felter:
<input type="text" value="00" name=m><input type=text value="00" name=t>

Nogen som kan hjælpe??
Et alternativ som også er fint, er at <input> felterne  ændres fra DISABLED til ENABLED når "d" eller "e" vælges.
Avatar billede majbom Novice
07. april 2009 - 19:14 #1
function toggleInputs(strValue){
  if(strValue=='d' || strValue=='e'){
      document.getElementById('m').disabled="false";
      document.getElementById('t').disabled="false";
  }else{
      document.getElementById('m').disabled="true";
      document.getElementById('m').disabled="true";
  }
}

<select onchange="toggleInputs(this.value)">...</select>

og så skal du have:

id="t"
og
id="m"

ind i dine 2 inputs
Avatar billede majbom Novice
07. april 2009 - 19:15 #2
hov...

function toggleInputs(strValue){
  if(strValue=='d' || strValue=='e'){
      document.getElementById('m').disabled="false";
      document.getElementById('t').disabled="false";
  }else{
      document.getElementById('m').disabled="true";
      document.getElementById('t').disabled="true";
  }
}

sådan! :)
Avatar billede spm Nybegynder
07. april 2009 - 19:39 #3
hmm den vil ikke. Den vil fint disable det, problemet er at den ikke vil enable det.
Jeg har i mellemtiden ændret lidt på variablerne, men også tilpasset dit forslag:

<script type="text/javascript">
function toggleInputs(strValue){
  if(strValue=='P' || strValue=='PA' || strValue=='GP' || strValue=='PDJ' ){
      document.getElementById('t').disabled="false";
      document.getElementById('m').disabled="false";
  }else{
      document.getElementById('t').disabled="true";
      document.getElementById('m').disabled="true";
  }
}
</script>

<SELECT name='vagt' onchange="toggleInputs(this.value)">
<option value='---'>Vagt</option>
<option value='A'>A</option>
<option value='L'>Å</option>
<option value='S'>S</option>
<option value='T'>T</option>
<option value='AF'>AF</option>
<option value='AS'>AS</option>
<option value='G'>G</option>
<option value='GS'>GS</option>
<option value='D'>D</option>
<option value='TK'>TK</option>
<option value='DJ'>DJ</option>
<option value='GP'>GP</option>
<option value='P'>P</option>
<option value='PA'>PA</option>
<option value='PDJ'>PDJ</option>
</SELECT><input type="text" id="t" name="ptime" size="2">
<input type="text" id="m" name="pmin" size="2" >

Har jeg gjort noget forkert?
Avatar billede majbom Novice
07. april 2009 - 20:00 #4
retter lige endnu en fejl...

function toggleInputs(strValue){
  if(strValue=='P' || strValue=='PA' || strValue=='GP' || strValue=='PDJ' ){
      document.getElementById('t').disabled=false;
      document.getElementById('m').disabled=false;
  }else{
      document.getElementById('t').disabled=true;
      document.getElementById('m').disabled=true;
  }
}

prøv med det :)
Avatar billede spm Nybegynder
08. april 2009 - 13:38 #5
se se... Så virker det ;)
Cool!!!!!!

Dropper du et svar?
Avatar billede majbom Novice
08. april 2009 - 14:29 #6
det kan du tro...

glemmer altid at der ikke skal " rundt om false og true :s
Avatar billede roenving Novice
08. april 2009 - 17:11 #7
Tjah, jeg ville vælge at have dem skjult indtil de evt. skal vises, og det gøres nemmest ved at placere dem i et omkransende element, der kan skjules eller vises efter behov:

<script type="text/javascript">
function showHideInps(selectd){
  if(selectd == 'P' || selectd=='PA' || selectd=='GP' || selectd=='PDJ' )
    document.getElementById("inpDiv").style.display = "block";
  else
    document.getElementById("inpDiv").style.display = "none";
}
</script>

<select name='vagt' onchange="showHideInps(this.value);">
...

<div id="inpDiv">
<input type="text" value="00" name=m><input type=text value="00" name=t></div>

Css:
#inpDiv{display:none;}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester