Avatar billede neander Nybegynder
17. december 2004 - 13:06 Der er 14 kommentarer og
1 løsning

action på valg i formularfelter

Jeg har et formularfelt - en dropdown, og når brugerne har valgt en af valgene i denne skal der automatisk sættes noget tekst ind i et textarea, afhængigt af hvad brugeren har valgt.

Valgene ser ud som sådan:
<option value='1'>Tekst nr 1</option>
<option value='2'>Tekst nr 2</option>

og vælger hans peter "tekst nr 1" skal tekst nr 1 sættes ind i et textarea nedenfor.

Hvordan kan det gøres med javascript?
Avatar billede roenving Novice
17. december 2004 - 13:22 #1
<select ... onchange="if(this.selectedIndex>0)this.form.TEXTAREANAVN.value+=this.value">
  <option>Vælg tekst</option>
  <option value='tekst nr 1'>Tekst nr 1</option>
  <option value='tekst nr 2'>Tekst nr 2</option>
</select>

-- den kan også løses med teksten udenfor value, men så er det bedst at have et javascript-array !-)
Avatar billede neander Nybegynder
17. december 2004 - 13:34 #2
Det fungerer fint, men kan man ikke få den foregående tekst i textarea til at forsvinde hvis man ændrer sit valg? Som det fungerer nu, så tilføjes formfeltets value blot den eksisterende tekst i textarea...
Avatar billede neander Nybegynder
17. december 2004 - 13:35 #3
Teksten som sættes ind i textarea sættes heller ikke ind i html'en... vil det på nogen måde blive muligt at ændre på f.eks. et value i et formularfelt - alt efter hvad der vælges i et andet formfelt?
Avatar billede roenving Novice
17. december 2004 - 13:41 #4
Du kan ikke ændre på html-koden, kun på den aktive html, hvis du ikke vil rigtig langt ud i noget, som vil kræve at hele siden genskrives ...

Jeg har brugt += til at tilføje med, da det er den typiske situation, men det kan bare erstattes med =, for så overskrives indholdet !-)
Avatar billede neander Nybegynder
17. december 2004 - 13:46 #5
tusind tak! læg et svar.

Hvor kan jeg eventuelt finde en tutorial på at kunne ændre værdier i values? Det er fordi at værdien som skal ind i selector-boxen skal genereres alt efter hvad brugerne indtaster forud i formularen, - en kreativ løsning bliver nok nødvendig...
Avatar billede roenving Novice
17. december 2004 - 14:05 #6
Hvordan skal du bruge det ?-)

-- afhængig af, hvordan du har behovet er der forskellige metoder at tilgå det med ...

Hvis du har færdige sæt af options er det nemmest at vise/skjule, men hvis de er dynamisk afhængige af konkrete indtastninger, kan det være andre metoder er bedre !-)
Avatar billede neander Nybegynder
17. december 2004 - 14:12 #7
Det skal fungere sådan, at hvis en person angiver at hun er født i 1978 og har fødselsdag den 1. august (3 dropdowns), så skal der automatisk genereres en værdi i min selectorbox med teksten: "Jeg er 26 år gammel" ved siden af en anden værdi, som er standard.
Avatar billede roenving Novice
17. december 2004 - 14:31 #8
Tjah, det rejser jo en hel del andre problemer ...

For det første kræver det så (eller er megete nemmere end alt andet !-) at de tre dropdowns har standard-værdier og skal reagere på ændringer hver især, for du kan ikke være sikker på rækkefølgen, der vælges i ...

For det andet er en alders-udregning lidt tricky, da man baglæns skal sikre sig at måned og dato ikke ændrer antallet af år, så derfor har jeg lavet et standard-bibliotek, som nemt kan bruges til den slags (selvom det betyder, at man får en masse unødvendige funktioner med !-) http://roenving.users.whitehat.dk/date/roenvingDate.html, som desværre er nede p.t. ...

Men en onchange="setAge(this.form)" på de tre dropdowns, og så noget script:

<script language="javascript" type="text/javascript" src="roenvingDate.js"></script>
<script language="javascript" type="text/javascript">
function setAge(f){
  var d = new Date();
  var birth = new Date(+f.selYear.value,(+f.selMonth.value-1),f.selDate.value);
  f.selTxt.options[1].value = 'Jeg er ' + d.age(birth,true)[0] + ' år gammel';
}
window.onload = function(){
  setAge(document.forms[0])
}
</script>

-- hvor selYear, selMonth og selDate er dato-selects og selTxt er tekst-selecten ...

Bemærk iøvrigt tricket med den tomme option, som sikrer, at onchange kaldes !-)
Avatar billede neander Nybegynder
17. december 2004 - 14:38 #9
okay... det lyder spændende. Så må jeg lige væbne mig med tålmodighed indtil whitehat er åben igen. Men er roenvingDate.html et dokument som kan kopieres over på den server hvor min side skal ligge, eller noget som fortsat skal ligge på whitehat?

Foreløbig vil jeg lige tilpasse min formular med ovenstående.
Avatar billede roenving Novice
17. december 2004 - 14:47 #10
Du skal som udgangspunkt kopiere det via linket til en .zip-fil på siden, for der er trafikrestriktioner på whitehat ...

-- men jeg kan også sende filen til dig, hvis det varer for længe (10 kb !-)
Avatar billede neander Nybegynder
17. december 2004 - 14:50 #11
okay - jeg skal nok lige skrive herinde, hvis jeg mister tålmodigheden. Foreløbeig laver jeg lige det jeg kan med dropdowns osv.
Avatar billede roenving Novice
17. december 2004 - 14:51 #12
Oki ...

-- og velbekomme '-)
Avatar billede roenving Novice
17. december 2004 - 14:55 #13
Tak for point ;~}
Avatar billede neander Nybegynder
20. december 2004 - 13:18 #14
Jeg er altså i tvivl om hvordan jeg skal bruge scriptet... min selectorbox skal naturligvis ikke se sådan ud:

<select class="select" name="selTxt" size="1" style="width: 530px;" onchange="if(this.selectedIndex>0)this.form.profiltekst.value=this.value">>

<option value='1'>-- v&aelig;lg en standardtekst --</option>
<option value='tekst 1'>Tekst 1</option>
<option value='tekst 2'>Tekst 2</option>
</select>

hvordan skal jeg lave den?
Avatar billede roenving Novice
21. december 2004 - 09:28 #15
Prøv at lege lidt med det script, jeg lagde 17/12-2004 14:31:32

-- evt. ved at udvide den, så der også er en text:

  f.selTxt.options[1].value = 'Jeg er ' + d.age(birth,true)[0] + ' år gammel';
  f.selTxt.options[1].text = 'Jeg er ' + d.age(birth,true)[0] + ' år gammel';
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