Søg
Avatar billede weblance Nybegynder
22. november 2004 - 16:24 Der er 3 kommentarer og
1 løsning

Lave røde bokse omkring manglende felter

Hej,

jeg har lavet denne formular:

<form name="formular" method="get" action="send.php" >
<div align="center"> 
<table width="265" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right" valign="middle"><table width="260" border="0" cellspacing="0" cellpadding="0">
<tr class="text">
<td width="141"><div align="left">Navn:</div></td>
<td width="122">&nbsp;</td>
</tr>
<tr class="text">
<td colspan="2"><div align="left">
<input name="navn" type="text" class="textfelt" id="navn" size="48">
</div></td>
</tr>
<tr class="text">
<td width="141"><div align="left">Adresse</div></td>
<td>&nbsp;</td>
</tr>
<tr class="text">
<td colspan="2"><div align="left">
<input name="adresse" type="text" class="textfelt" id="adresse" size="48">
</div></td>
</tr>
<tr class="text">
<td width="141"><div align="left">Postnr.</div></td>
<td><div align="left">By</div></td>
</tr>
<tr class="text">
<td width="141"><div align="left">
<input name="postnr" type="text" class="textfelt" id="postnr">
</div></td>
<td><div align="left">
<input name="by" type="text" class="textfelt" id="by">
</div></td>
</tr>
<tr class="text">
<td width="141"><div align="left">Telefon</div></td>
<td><div align="left">Email</div></td>
</tr>
<tr class="text">
<td width="141"><div align="left">
<input name="telefon" type="text" class="textfelt" id="telefon">
</div></td>
<td><div align="left">
<input name="email" type="text" class="textfelt" id="email">
</div></td>
</tr>
<tr class="text">
<td width="141"><div align="left">Besked</div></td>
<td>&nbsp;</td>
</tr>
<tr class="text">
<td colspan="2"><div align="left">
<textarea name="besked" cols="50" rows="4" class="textfelt" id="besked"></textarea>
</div></td>
</tr>
<tr class="text">
<td height="5" colspan="2"><img name="spacer" src="" width="10" height="5" alt=""></td>
</tr>
<tr class="text">
<td colspan="2"><div align="center">
<table width="100%"  border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" height="22"><div align="center">
<input name="Submit" type="submit" class="knap" value="Send">
</div></td>
<td width="50%"><div align="center">
<input name="Reset" type="reset" class="knap" value="Nulstil">
</div></td>
</tr>
</table>
</div></td>
</tr>
</table></td>
</tr>
</table>
</div>
</form>

Spørgsmålet er: Jeg vil gerne have at rammen i de inputfelter bliver rød når de ikke er udfyldte - hvordan laver man det???

/carl
Avatar billede powernodes Nybegynder
22. november 2004 - 16:33 #1
et simpelt eks:

function validate(form) {
  if (form.f1.value == "") {
    form.f1.style.borderColor = "red";
    form.f1.focus();
    return false;
  }
  if (form.f2.value == "") {
    form.f2.style.borderColor = "red";
    form.f2.focus();
    return false;
  } else {
    return true;
  }
}

og

<form method="post" onsubmit="return validate(this);">
<input type="text" name="f1" style="border: 1px black solid"><br>
<input type="text" name="f2" style="border: 1px black solid"><br>
<input type="submit" value="send">
</form>
Avatar billede weblance Nybegynder
22. november 2004 - 21:57 #2
Jeg har fundet dette script og modificeret det:

<script type="text/javascript">
function validering()
  {
 
  error = 0;
    document.forms[0].navn.style.borderColor = "#666666";
    document.forms[0].adresse.style.borderColor = "#666666";
    document.forms[0].postnr.style.borderColor = "#666666";
    document.forms[0].by.style.borderColor = "#666666";
    document.forms[0].telefon.style.borderColor = "#666666";
    document.forms[0].email.style.borderColor = "#666666";
    document.forms[0].besked.style.borderColor = "#666666";
   
  if((document.forms[0].navn.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med dit navn!');
    document.forms[0].navn.style.borderColor = "red";
    document.forms[0].navn.focus();
    error = 1;
           
  }

  if((document.forms[0].adresse.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med din adresse!');
    document.forms[0].adresse.style.borderColor = "red";
    document.forms[0].adresse.focus();
    error = 1;       
  }   
 
  if((document.forms[0].postnr.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med dit postnummer!');
    document.forms[0].postnr.style.borderColor = "red";
    document.forms[0].postnr.focus();
    error = 1;       
  }   
 
  if((document.forms[0].by.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med din by!');
    document.forms[0].by.style.borderColor = "red";
    document.forms[0].by.focus();
    error = 1;       
  }   
 
  if((document.forms[0].telefon.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med dit telefonnummer!');
    document.forms[0].telefon.style.borderColor = "red";
    document.forms[0].telefon.focus();
    error = 1;       
  }
 
  if((document.forms[0].email.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med emailadresse!');
    document.forms[0].email.style.borderColor = "red";
    document.forms[0].email.focus();
    error = 1;       
  }       

    if((document.forms[0].besked.value=='') && (error==0)) 
  {       
    alert('Du skal skrive noget tekst!');
    document.forms[0].besked.style.borderColor = "red";
    document.forms[0].besked.focus();
    error = 1;       
  }       

  if(error == 0)
  document.forms[0].submit();   
  }
</script>
Avatar billede weblance Nybegynder
22. november 2004 - 21:57 #3
Sender du et svar så du kan få point for din inspiration!!
Avatar billede powernodes Nybegynder
23. november 2004 - 08:49 #4
Allright
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 14:53 TV4ever 3.0 Af valby i Diverse
01/0816:21 Installere Ubuntu på Virtuel Maskine Af Uvanga i Andet software
01/0809:38 Microsoft har igen ødelagt mit højreklik Af valby i Windows
30/0714:41 To mails fra YouSee - Jeg tror ikke altid på tilfældigheder Af mort1 i Andet sikkerhed
27/0714:34 Hjælp til at kunne skanne negativer på Plustek 8300i SE Af Mariann i Foto & video
White papers
Flere white papers »