Avatar billede leif Seniormester
14. oktober 2010 - 20:52 Der er 7 kommentarer og
1 løsning

Tilføj extra række af indtastningsfelter og verificer de er udfyldt

Hej,

Jeg står med en udfordring.

Jeg skal ud fra en dropdown vælge hvor mange linier der skal laves, og jeg må ikke kunne submitte formen hvis jeg har udfyldt 4 linier men valgt 5

Jeg er gået rimelig kold og synes ikke jeg kan finde noget på google jeg kan bruge (måske mig som søger forkert)

/Leif
Avatar billede majbom Novice
14. oktober 2010 - 22:27 #1
du kunne lave alle dine inputboxe og lade dem være skjult pr default med css: display=none

hvert felt har et unikt id, f.eks. input_0, input_1 osv.

når du vælger et tal i dropdown, sender du det valgte tal med til en funktion der med en løkke kører det antal gange som der er valgt og dermed sætte display=block

når der submittes kører du en anden funktion som også benytter den tidligere valgte tal og på samme måde itererer igennem det valgte antal felter og tjekker for mangler/fejl...

håber det gav mening og inspiration :)
Avatar billede jokkejensen Novice
14. oktober 2010 - 22:34 #2
Her er et hurtigt eksempel, der skulle være til at bygge lidt videre på.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">

        var lineMarkup = "<fieldset><input type='text' /></fieldset>";
        $(document).ready(function () {

            $("#selectLines").val(0);

            $("#selectLines").change(function () {
                $("#lines").html("");
                for (i = 0; i < $("#selectLines").val(); i++) {
                    $("#lines").append($(lineMarkup).attr('id', 'line' + (i + 1)));
                }
            });

            $("form").submit(function () {
                var errors = $("input[value=]:text").length;
                if (errors == 0) {
                    alert("weeee");
                } else {
                    alert("alle linier skal udfyldes, ellers fjern.")
                }
            });

        });

    </script>
</head>
<body>
<form action="#" method="get">
<select id="selectLines">
<option value="0">ingen..</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<div id="lines">
</div>
<input type="submit" />
</form>
</body>
</html>
Avatar billede leif Seniormester
17. oktober 2010 - 17:12 #3
Sorry, men hvordan får jeg den til IKKE at fjerne linierne, men blot komme med en fejlbesked ?
Avatar billede leif Seniormester
01. november 2010 - 08:31 #4
Jeg fik det aldrig til at virke helt som jeg ville og der blev valgt en anden løsning, men jokkejensen smid et svar.
Avatar billede leif Seniormester
08. november 2010 - 10:02 #5
jokkejensen -> Smider du et svar ?
Avatar billede leif Seniormester
16. januar 2011 - 12:14 #6
Hvis jokkejensen ønsker et point for hans tid så oprettes et "point" spørgsmål.
Avatar billede majbom Novice
16. januar 2011 - 12:27 #7
Hvilken løsning endte du med? Det kunne være der kom andre forbi med samme problem...  :)
Avatar billede leif Seniormester
16. januar 2011 - 12:35 #8
Det endte med den "simple" løsning, da man fandt ud af at det var ikke interessant om der var 5 eller 10 linier da det ville give det samme resultat, så man endte med at blot have 5 faste linier
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