Avatar billede ktad Nybegynder
27. februar 2010 - 10:45 Der er 7 kommentarer

Webformular med antal valg

Hi Eksperter

Jeg sidder og skal oprette en Webformular som skal skrive nogle data i en DB

Selve skrivningen til database osv. fungerer fint, men mangler en enkelt funtionalitet.

Det er sådan at man skal kunne vælge "antal" i starten af formularen og så tilpaser den sig til antallet.

F.eks. via en dropdown boks hvor man kan vælge mellem 1, 2 eller 3 herefter tilpasser formularen sig og viser henholdsvis 1, 2 eller 3 tilmeldingsfelter med diverse data (navn, adresse, by f.eks)


Altså (ved valg af 3)

S1 Navn
S1 By

S2 Navn
S2 By

S3 Nav
S3 By

Opret knap

ELLER (ved valg af 1)

S1 Navn
S1 By

Opret knap

Håber nogle kan hjælpe derude :-)
Avatar billede muunsim Nybegynder
27. februar 2010 - 11:04 #1
Du skal nok have fat i noget javascript til at styre det her.

Du skal lave en drop down boks hvor man kan vælge antal, og value for hver enkelt option skal have et nummer svarende til det antal felter du vil vise.

Her fra er der to måder at gøre det på.

1: Du laver hele formen først (f.eks. 10 felter, hvis det er så mange du vil have maksimum) - enten i html eller i ASP

2: Du laver et loop i javascript der udskriver det antal felter du skal bruge når man vælger i drop down boksen.

ulempen ved 2 ligger dog i, at hvis man først har skrevet noget tekst, og ombestemmer sig for at der skal være flere felter, skal man starte forfra med at skrive, hvorimod ved mulighed 1 kan man lægge alle form elementerne i divs med style display:none; og på den måde bare vise dem der skal bruges.

Et kode eksempel ville være noget i denne stil (mulighed 1):

<form action="">
<select name="antal">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
<div id="ele-1">
  <input type="text" name="navn_1" />
  <input type="text" name="by_1" />
</div>
<div id="ele-2">
  <input type="text" name="navn_2" />
  <input type="text" name="by_2" />
</div>
<div id="ele-3">
  <input type="text" name="navn_3" />
  <input type="text" name="by_3" />
</div>
</form>

Vil ikke poste javascript koden her, da jeg ikke kan huske den i hovedet, men du skal have fat i onChange på din select.

Der finder du så value for den valgte option og kører et javascript loop hvor den sætter display:block; på de elementer der skal bruges ;)

Ved ikke hvor meget mening det gav?
Avatar billede tjens Nybegynder
27. februar 2010 - 11:06 #2
Avatar billede claes57 Ekspert
27. februar 2010 - 11:21 #3
du laver det med alle tre grupper - placeret i hver sin <div>.
ved valg i comboboksen aktiverer du et javascript, der retter style, så det rigtige antal bliver synlige.

http://snippets.dzone.com/posts/show/1721
Avatar billede muunsim Nybegynder
27. februar 2010 - 11:26 #4
claes57: præcis det jeg foreslog ;)
Avatar billede ktad Nybegynder
01. marts 2010 - 15:20 #5
Tusind tak for indsparkene, jeg venter lige med at lukke spørgsmålet indtil jeg har fået det til at virke (er ikke lige den store JS haj nemlig)
Avatar billede ktad Nybegynder
17. marts 2010 - 14:04 #6
Kan ikke rigtig få det til at spille.. :-(
Nogen der kan hjælpe med den specifikke sammensætning af koden?
Avatar billede ktad Nybegynder
05. april 2010 - 11:38 #7
Smid et svar hvis du vil have point. Lukker spørgsmålet har fundet løsningen.
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

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