Avatar billede Jman Praktikant
31. maj 2005 - 08:29 Der er 38 kommentarer og
2 løsninger

checkform i en dynamisk oprettet <form>

Jeg har en dynamisk liste, hvor der genereres <form> for hver record. Jeg skal tjekke på et felt enkelt felt for kun at indeholde tal, men det vil bare ikk' - Hvad er fejlen i nedenstående:
(tillægsspørgsmål: er der en smart måde at lave en alert-boks, når der indtastes andet end tal med det samme i stedet for ved submit?)

<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform()
    {
    if(!document.form<%=rs("id")%>.items<%=id%>.value.match(/^[0-9]/)){
    alert("Der må kun indtastes tal i bestillingsfelterne");
    document.form<%=rs("id")%>.items<%=id%>.focus();
    return false;
    }
    // ** End checkform **
  return true;
}
</script>
<!--- CHECKFORM SLUT --->

<!--- form --->
<form name="form<%=rs("id")%>" action="<%=ShopLink%>add.asp&amp;a_id=<%=id%>" method="post" OnSubmit="return checkform();">
  <input type="text" name="items<%=id%>" size="2" value="1">
  <input type="hidden" name="preis<%=id%>" value="<%=rs("preis")%>">
  <input type="hidden" name="nr<%=id%>" value="<%=rs("artikelnr")%>">
  <input type="hidden" name="bez<%=id%>" value="<%=rs("bezeichnung")%>">
  <a class="text" href="java script:document.form<%=id%>.submit();"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<%=s_add_product%>"></a>
</form>
<!--- FORM SLUT --->
Avatar billede olebole Juniormester
31. maj 2005 - 10:41 #1
<ole>

Denne vil kun tage imod tal:

<script type="text/JavaScript">
function checkInp(inp) {
    while (!inp.value.match(/^\d*$/)) inp.value = inp.value.substr(0, inp.value.length-1);
}
</script>

<input type="text" onkeyup="checkInp(this)" onblur="checkInp(this)">

Derudover kan du jo altid referere til formen selv med:
    onsubmit="myOwnShit(this)"

- og funktionen:

function myOwnShit(f) {
  if (!f.item.value.match(/^[0-9]/)) {
      // blablabla
  }
}

Husk, at der gerne må være flere elementer med samme name-attribut ... det er kun ID's, der skal være unikke. Derfor lader jeg somom navnet på feltet i alle formene er 'item'  :)

/mvh
</bole>
Avatar billede nielle Nybegynder
31. maj 2005 - 10:45 #2
<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform()
{
    $myRegexp = /^\d$/;
    if (!$myRegexp.test(document.form<%=rs("id")%>.items<%=id%>.value))
    {
        alert("Der må kun indtastes tal i bestillingsfelterne");
        document.form<%=rs("id")%>.items<%=id%>.focus();
        return false;
    }
    // ** End checkform **
    return true;
}
</script>
<!--- CHECKFORM SLUT --->

<!--- form --->
<form name="form<%=rs("id")%>" action="<%=ShopLink%>add.asp&amp;a_id=<%=id%>" method="post" OnSubmit="return checkform();">
    <input type="text" name="items<%=id%>" size="2" value="1">
    <input type="hidden" name="preis<%=id%>" value="<%=rs("preis")%>">
    <input type="hidden" name="nr<%=id%>" value="<%=rs("artikelnr")%>">
    <input type="hidden" name="bez<%=id%>" value="<%=rs("bezeichnung")%>">
    <a class="text" href="java script:document.form<%=rs("id")%>.submit();"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<%=s_add_product%>"></a>
</form>
<!--- FORM SLUT --->
Avatar billede olebole Juniormester
31. maj 2005 - 10:46 #3
PS: Et form-element (men kun et form-element ... ikke f.eks. et link i formen) kan altid referere til formen med 'this.form':

<form>
  <input type="text" name="gnu" value="hest">
  <input type="text" onfocus="this.value=this.form.gnu.value">
</form>
Avatar billede nielle Nybegynder
31. maj 2005 - 10:47 #4
Rettelser i din checkForm og en rettelse i din form:

<a class="text" href="java script:document.form<%=id%>.submit();">

- til:

<a class="text" href="java script:document.form<%=rs("id")%>.submit();">
Avatar billede olebole Juniormester
31. maj 2005 - 10:54 #5
Oooops ... jeg havde slet ikke set, du submitter med JS. Så duer det slet ikke at anvende onsubmit-event'en, da den ikke bliver fyret af ved JS-submit  :)

Brug denne i stedet:

<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform(f)
    {
    if(!f.items<%=id%>.value.match(^\d*$)) {
    alert("Der må kun indtastes tal i bestillingsfelterne");
    f.items<%=id%>.focus();
    return false;
    }
    // ** End checkform **
  return true;
}
</script>
<!--- CHECKFORM SLUT --->

<!--- form --->
<form name="form<%=rs("id")%>" action="<%=ShopLink%>add.asp&amp;a_id=<%=id%>" method="post">
  <input type="text" name="items<%=id%>" size="2" value="1">
  <input type="hidden" name="preis<%=id%>" value="<%=rs("preis")%>">
  <input type="hidden" name="nr<%=id%>" value="<%=rs("artikelnr")%>">
  <input type="hidden" name="bez<%=id%>" value="<%=rs("bezeichnung")%>">
  <a class="text" href="#" onclick="checkform(document.form<%=rs("id")%>);return false"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<%=s_add_product%>"></a>
</form>
<!--- FORM SLUT --->

- og du behøver kun én checkform-funktion, der tager sig af alle forms i listen  ;o)
Avatar billede olebole Juniormester
31. maj 2005 - 10:59 #6
Det var noget vrøvl OleBole ... sådan:

<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform(inx)
    {
    var inp = document.forms["form"+inx].elements["items"+inx];
    if(!inp.value.match(^\d*$)) {
    alert("Der må kun indtastes tal i bestillingsfelterne");
    inp.focus();
    return false;
    }
    // ** End checkform **
  return true;
}
</script>
<!--- CHECKFORM SLUT --->

<!--- form --->
<form name="form<%=rs("id")%>" action="<%=ShopLink%>add.asp&amp;a_id=<%=id%>" method="post">
  <input type="text" name="items<%=id%>" size="2" value="1">
  <input type="hidden" name="preis<%=id%>" value="<%=rs("preis")%>">
  <input type="hidden" name="nr<%=id%>" value="<%=rs("artikelnr")%>">
  <input type="hidden" name="bez<%=id%>" value="<%=rs("bezeichnung")%>">
  <a class="text" href="#" onclick="checkform(<%=rs("id")%>);return false"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<%=s_add_product%>"></a>
</form>
<!--- FORM SLUT --->
Avatar billede olebole Juniormester
31. maj 2005 - 11:01 #7
Damned ...!!! Sådan skal funktionen se ud:

<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform(inx)
    {
    var inp = document.forms["form"+inx].elements["items"+inx];
    if(!inp.value.match(^\d*$)) {
    alert("Der må kun indtastes tal i bestillingsfelterne");
    inp.focus();
    return false;
    }
    // ** End checkform **
  document.forms["form"+inx].submit();
}
</script>
<!--- CHECKFORM SLUT --->
Avatar billede Jman Praktikant
31. maj 2005 - 11:08 #8
Der er ingen af dem, jeg kan få til at fungere .. er det nødvendigt at nævne at det er i en løkke at det foregår ?
Avatar billede nielle Nybegynder
31. maj 2005 - 11:10 #9
Heller ikke min?

Nej vi er godt klar over at det foregår i en løkke - skrevet i ASP.
Avatar billede Jman Praktikant
31. maj 2005 - 11:13 #10
nope .. din hopper bare videre og så får jeg naturligvis type mismatch på næste side, når der er indtastet andet end tal
Avatar billede olebole Juniormester
31. maj 2005 - 11:13 #11
nielle >> Din bliver jo aldrig afviklet  :)

superior >> Jeg er helt sikker på, denne virker:

<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform(inx)
    {
    var inp = document.forms["form"+inx].elements["items"+inx];
    if(!inp.value.match(^\d*$)) {
    alert("Der må kun indtastes tal i bestillingsfelterne");
    inp.focus();
    return false;
    }
    // ** End checkform **
  document.forms["form"+inx].submit();
}
</script>
<!--- CHECKFORM SLUT --->

<!--- form --->
<form name="form<%=rs("id")%>" action="<%=ShopLink%>add.asp&amp;a_id=<%=id%>" method="post">
  <input type="text" name="items<%=id%>" size="2" value="1">
  <input type="hidden" name="preis<%=id%>" value="<%=rs("preis")%>">
  <input type="hidden" name="nr<%=id%>" value="<%=rs("artikelnr")%>">
  <input type="hidden" name="bez<%=id%>" value="<%=rs("bezeichnung")%>">
  <a class="text" href="#" onclick="checkform(<%=rs("id")%>);return false"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<%=s_add_product%>"></a>
</form>
<!--- FORM SLUT --->

Hvis rs("id") indeholder et tal, vil koden virke, som den er. Er det en streng, skal du huske gåseøjne i kaldet:
    onclick="checkform('<%=rs("id")%>');return false">

Virker det ikke, må du lægge et link til siden  :)
Avatar billede olebole Juniormester
31. maj 2005 - 11:16 #12
- og husk: Én funktion ... mange forms.
Funktionen skal ikke skrives ud i loope'et ... kun formen
Avatar billede nielle Nybegynder
31. maj 2005 - 11:16 #13
olebole> Nej, det har du ganske ret i.
Avatar billede Jman Praktikant
31. maj 2005 - 11:20 #14
Jeg får en fejl "Et objekt var ventet"
Avatar billede olebole Juniormester
31. maj 2005 - 11:21 #15
yups ... som jeg skrev tidligere, fyres onsubmit-handler'en aldrig af, når en form submittes via JS  :)

Desuden vil alle funktionerne jo overskrive hinanden, da de har samme navn. Har du 10 fuktioner med navnet 'checkform', vil kun den sidste blive kaldt, ligegyldig hvilken form, der kalder. Det noget skidt, hvis funktionerne har referencer til specifikke forms og elementer  ;o)
Avatar billede olebole Juniormester
31. maj 2005 - 11:21 #16
I hvilken linie?
Avatar billede olebole Juniormester
31. maj 2005 - 11:22 #17
Hvad indeholder rs("id")? Streng eller tal?
Avatar billede nielle Nybegynder
31. maj 2005 - 11:24 #18
Et sidste indskud herfra:

Mon ikke mønsteret for det regulære udtryk skal være noget i stil med:

^[1-9]\d{0,1}$

Feltet er jo dimensioneret til to cifre og det må vel hverken være tomt eller indeholde "0"?
Avatar billede Jman Praktikant
31. maj 2005 - 11:25 #19
i denne:  <a class="text" href="#" onclick="checkform(20);return false"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="Læg dette produkt i indkøbsvognen"></a>

Det er et tal .. jeg har forinden lavet denne id = Cint(rs("id")
Avatar billede olebole Juniormester
31. maj 2005 - 11:26 #20
Så er checkform vel ikke skrevet ud til siden - eller staves på en anden måde

nielle >> Det er i hvert fald ikke det, der giver fejlen
Avatar billede nielle Nybegynder
31. maj 2005 - 11:29 #21
Det er jeg 100% klar over. Det kan højst give problemer på den efterfølgende side. Synes bare at det burde påpeges. :^)
Avatar billede Jman Praktikant
31. maj 2005 - 11:30 #22
Dette er kildekoden, efter eksekvering:

<!---CHECKFORM---->
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
function checkform(inx)
    {
    var inp = document.forms["form"+inx].elements["items"+inx];
    if(!inp.value.match(^\d*$)) {
    alert("Der må kun indtastes tal i bestillingsfelterne");
    inp.focus();
    return false;
    }
    // ** End checkform **
  document.forms["form"+inx].submit();
}
</script>
<!--- CHECKFORM SLUT --->

<!--- form --->
<form name="form20" action="frontpage.asp?SubDir=Webshop&amp;Side=add.asp&amp;a_id=20" method="post">
  <input type="text" name="items20" size="2" value="1">
  <input type="hidden" name="preis20" value="20,5">
  <input type="hidden" name="nr20" value="1221">
  <input type="hidden" name="bez20" value="Star Trek Nemesis DVD">
  <a class="text" href="#" onclick="checkform(20);return false"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="Læg dette produkt i indkøbsvognen"></a>
</form>
<!--- FORM SLUT --->

Dem kommer der så flere af i løkkken, men med ændret id
Avatar billede Jman Praktikant
31. maj 2005 - 11:30 #23
i øvrigt kan den bypasses med klik på enter i stedet for "bestil"-imaget (??)
Avatar billede olebole Juniormester
31. maj 2005 - 11:32 #24
Doooohhhh ... jeg havde glemt slashes i RegExp'en ... sorry  :)
    if( !inp.value.match(/^\d*$/) ) {
Avatar billede olebole Juniormester
31. maj 2005 - 11:34 #25
Klik på Enter klarer du med:
    onsubmit="return false"
Avatar billede Jman Praktikant
31. maj 2005 - 11:34 #26
YESSIR!
Så virker den - og med scriptet der kun tager imod tal er det perfekt .. Lægger du et svar ?
Avatar billede olebole Juniormester
31. maj 2005 - 11:37 #27
Kan nielle og jeg ikke dele 40/20? Han har udvist interesse i hele forløbet og forsøgt at komme med relevante indspark  :)
Avatar billede Jman Praktikant
31. maj 2005 - 11:39 #28
Jo - det har du ret i ... jeg dobler lige.. nielle: kom med et svar :o)
Avatar billede nielle Nybegynder
31. maj 2005 - 11:49 #29
Ok så :^)
Avatar billede Jman Praktikant
31. maj 2005 - 11:51 #30
og så et svar  c",)
Avatar billede nielle Nybegynder
31. maj 2005 - 11:52 #31
... og ret nu det der RegExp til:

if ( !inp.value.match(/^[1-9]\d{0,1}$/) ) {
Avatar billede nielle Nybegynder
31. maj 2005 - 11:53 #32
Jeg er altså vildt handikappet mht. at glemme Svar-rsdioen. :^|
Avatar billede Jman Praktikant
31. maj 2005 - 11:54 #33
så siger jeg mange tak for hjælpen!
Avatar billede nielle Nybegynder
31. maj 2005 - 12:11 #34
Takker for points. Lidt overvældende. :^)

Personligt ville jeg nok have lavet det over denne skabelon i stedet:

<form action="<%=ShopLink%>add.asp" method="post" OnSubmit="return checkform();">
    <input type="hidden" name="id" value="<% =rs("id") %>">
    <input type="hidden" name="preis" value="<% =rs("preis") %>">
    <input type="hidden" name="nr" value="<% =rs("artikelnr") %>">
    <input type="hidden" name="bez" value="<% =rs("bezeichnung") %>">
    <input type="text" name="items" size="2" value="1">
    <a class="text" href="java script:this.submit();"><img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<%=s_add_product%>"></a>
</form>

Altså ved at have id som et hidden felt mere, fjerne alle navne-referencer til id og så bruge submit() sammen med this.
Avatar billede olebole Juniormester
31. maj 2005 - 20:46 #35
nielle >> God idé, som desværre ikke virker. Som jeg skrev tidligere:
"Et form-element (men kun et form-element ... ikke f.eks. et link i formen) kan altid referere til formen med 'this.form'" - så deeeeeeeet ......  :)

- men jeg er enig i, at det er lidt overkill at give felterne nummererede navnene. Du er dog nødt til at lave en reference til formen, når denne skal submittes  ;o)
Avatar billede olebole Juniormester
31. maj 2005 - 20:47 #36
- og tak for points! Det var jo ikke meningen at 'flå' nogen ... jeg ville bare gerne dele  ;o)
Avatar billede nielle Nybegynder
31. maj 2005 - 20:59 #37
Man kan jo også lave en løsning hvor det ikke er et link, men rent faktisk en button:

<button type="submit" onClick="checkInp(this)">
<img border=0 src="webshop/pics/AddBasket.gif" width=100px height=17px align="middle" alt="<% =s_add_product %>">
</button>
Avatar billede olebole Juniormester
31. maj 2005 - 21:50 #38
Nuvel, men så er denne nok endnu lettere:
  <input type="image" src="webshop/pics/AddBasket.gif" title="<%=s_add_product%>">

- og så kan man igen køre valideringen på onsubmit. Det er ikke fordi, jeg sidder og venter på at kunne rette dig, nielle - selvom jeg godt kan se, det begynder at ligne et mønster  :)
Jeg håber dog, du tager det fra den positive side og suger lidt til dig. Der er jo ikke spor i vejen med din løsning - koden bliver bare en smule mindre  ;o)
Avatar billede nielle Nybegynder
31. maj 2005 - 21:52 #39
Jeg er her skam *også* for at lære - og så kan vi forresten lige så godt give superior valuta for sine points :^)
Avatar billede olebole Juniormester
31. maj 2005 - 21:57 #40
PS: Der er lige et par ting, man skal være opmærksom på ved type="image":

1. Elementet hører ikke som sådan med til formen. Det kan således ikke referere til 'sin' form med 'this.form'.
2. Giver man elementet en name-attribut (f.eks: name="gnu"), kan denne ikke findes på serveren.
Det kan derimod variablerne 'gnu_x' og 'gnu_y', der indeholder koordinaterne for brugerens klik ... hvilket jo kan bruges til mange sjove ting (klik på et kort er kun én anvendelses mulighed)
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