Eingabeüberprüfung

[Herbert1204]

Hallo Ich habe ein Script, was die Vollständigkeit der Eingaben überprüft. Dabei stehen die Fehlermeldungen unter den Eingabefelder. Um zwischen den Eingabefelder keinen Platz zu verschwenden, sollen die Felder, wenn keine Fehlermeldung vorhanden ist, hochgeschoben werden. Ist das möglich?

Hier ist das Script

<SCRIPT LANGUAGE="JavaScript"> <!-- // (C) 2002 Klaus Hentschel [ All rights reserved ]. // e-mail: [e-mail] // www: http://www.javarea.de

function validate_form() {

validity = true;

if (!check_empty(document.form.Benutzername.value)){ /* Funktion Namen (Abfrage) /   validity = false;   show('Layer1');show('Layer2'); / zeige Fehler /   }   if (!check_empty(document.form.Passwort1.value)){ / Funktion Namen (Abfrage) / validity = false; show('Layer1');show('Layer3'); / zeige Fehler / }   if (document.form.Passwort1.value != document.form.Passwort2.value){ / Passwoerter sind nicht gleich /         validity = false;         show('Layer1');show('Layer4');                          / zeige Fehler /         }   if (!check_empty(document.form.Geschlecht.value)){ / Funktion Namen (Abfrage) /   validity = false;   show('Layer1');show('Layer5'); / zeige Fehler /   }   if (!check_empty(document.form.Tag.value)){ / Funktion Namen (Abfrage) /   validity = false;   show('Layer1');show('Layer6'); / zeige Fehler /   }   if (!check_empty(document.form.Monat.value)){ / Funktion Namen (Abfrage) /   validity = false;   show('Layer1');show('Layer6'); / zeige Fehler /   }   if (!check_empty(document.form.Jahr.value)){ / Funktion Namen (Abfrage) /   validity = false;   show('Layer1');show('Layer6'); / zeige Fehler /   }   var plz = document.form.Postleitzahl.value;   if (plz.search(/^([0-9]{5})$/) == -1){ / PLZ ist falsch /         validity = false;         show('Layer1');show('Layer7'); / zeige Fehler /         }   if (!check_email(document.form.EMail.value)){ / Funktion E-Mail (Abfrage) /   validity = false;   show('Layer1');show('Layer8'); / zeige Fehler /   }   if (!check_checkbox(document.form.Nutzungsbedingungen.checked)){ / Funktion Comment (Abfrage) /   validity = false;   show('Layer9'); / zeige Fehler /   }   if (validity);   return validity; / alle Angaben waren korrekt /   }   function check_empty(text) { return (text.length > 0); / gibt false zurück wenn leer /   }   function check_email(address) { / Email muss (@ und .) enthalten /   if ((address == "") || (address.indexOf ('@') == -1) || (address.indexOf ('.') == -1))   return false;   return true;   }   function check_checkbox(r) {   return (r); / gibt false zurück wenn nicht übergebener Wert */   }   if (((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0,1)) >=3))   || ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion.substring(0,1)) >=4)))

{var version=true}

if (document.layers){ /* Browserabfrage: Layer-Object bekannt? /   ns = 1; ie = 0;   }else{   ns = 0; ie = 1;   }   function show(name) {if (ns){ / Funktion Schicht anzeigen /   document.layers['' + name].visibility = "show";   }else{   document.all['' + name].style.visibility = "visible";   }   }   function hide(name) { / Funktion Schicht verstecken */   if (ns){   document.layers['' + name].visibility = "hide";   }else{   document.all['' + name].style.visibility = "hidden";   }   } // --> </SCRIPT>

<form name="form" method="post" action="mailto:[e-mail]?SUBJECT=Betreff für die Mail" enctype="text/plain" onSubmit="return validate_form(this.form)">

<table cellspacing="0" width="760" bordercolordark="white" bordercolorlight="black">     <tr>         <td height="75" align="left" valign="bottom" colspan="2">     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;     <font face="Arial Black"><span style="font-size:16pt;">Anmeldung</span></font> <hr color="#66FF66" size="3">

</td>     </tr>     <tr>         <td align="left" valign="middle" colspan="2">     <font face="Arial"><span style="font-size:10pt;"><b>Mit</b></span><b> <strong><span style="font-size: 15pt; color: #ff0000">* </span></strong><font face="Arial"><span style="font-size:10pt;">gekennzeichnete Felder sind Pflichtfelder</span></font></b></font>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>Benutzername:</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></font></span></strong>

</td>         <td align="left" valign="middle" height="1" width="580">     <input type="text" name="Benutzername" style="width:325px;">     <div id="Layer2" style="visibility:hidden"><font color="red" face="Arial"><span style="font-size:10pt;">Bitte Benutzername angeben!</span></font></div>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>Passwort:</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></font></span></strong>

</td>         <td align="left" valign="middle" height="1" width="580">     <input type="password" name="Passwort1" style="width:325px;">     <div id="Layer3" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:10pt;">Bitte Passwort angeben!</span></font></div>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>Passwort wiederholen</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></font></span></strong>

</td>         <td align="left" valign="middle" height="1" width="580">     <input type="password" name="Passwort2" style="width:325px;">     <div id="Layer4" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:10pt;">Die Passw&ouml;rter stimmen leider nicht &uuml;berein!</span></font></div>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>Geschlecht:</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></font></span></strong>

</td>         <td align="left" valign="middle" height="1" width="580">     <select name="Geschlecht" style="width:325px;" size="1">     <option></option>     <option value="Female">Weiblich</option>     <option value="Male">M&auml;nnlich</option>     </select>     <div id="Layer5" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:10pt;">W&auml;hle dein Geschlecht!</span></font></div>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>Geburtsdatum:</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></font></span></strong>

</td>         <td align="left" valign="middle" height="1" width="580">                 <select name="Tag" style="width:80px;">                 <option></option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option>          </select> &nbsp;&nbsp;                 <select name="Monat" style="width:130px;">                 <option></option> <option value="1">Januar</option> <option value="2">Februar</option> <option value="12">Dezember</option>          </select> &nbsp;&nbsp;                 <select name="Jahr" style="width:85px;">                 <option></option> <option value="1910">1910</option> <option value="1911">1911</option> <option value="1980">1980</option> <option value="1989">1989</option>                 <option value="1990">1990</option>           </select>

<div id="Layer6" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:10pt;">Dein Geburtsdatum ist nicht korrekt!</span></font></div>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>PLZ</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></strong><font face="Arial"><span style="font-size:10pt;"> <b>und Wohnort</span></font></b></span></font>

</td>         <td align="left" valign="middle" height="1" width="580">     <input type="text" name="Postleitzahl" style="width:45px;" maxlength="5">&nbsp;<input name="Wohnort" type="text" style="width:275px;" />

<div id="Layer7" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:10pt;">Die Postleitzahl ist nicht korrekt!</span></font></div>

</td>     </tr>     <tr>         <td width="160" align="left" valign="middle" height="1">     <font face="Arial"><span style="font-size:10pt;"><b>E-Mail:</b> <strong><span style="font-size: 15pt; color: #ff0000">*</span></span></strong>

</td>         <td align="left" valign="middle" height="1" width="580">     <input type="text" name="EMail" style="width:325px;">     <div id="Layer8" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:10pt;">Die E-Mail ist nicht korrekt!</span></font></div>

</td>     </tr>     <tr>         <td height="40" align="left" valign="middle" colspan="2">     <input type="checkbox" name="Nutzungsbedingungen"><font face="Arial"><span style="font-size:10pt;"><b>Ich stimme den <a href="http://">Nutzungsbedingungen</a> und den <a href="http">Datenschutzerkl&auml;rung<a> zu.</a></b></span></font>    </td>     </tr>     <tr>         <td height="1" align="left" valign="bottom" colspan="2">     <div id="Layer9" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:11pt;"><b>Du mu&szlig;t noch den Nutzungsbedingungen zustimmen!</b></span></font></div>

</td>     </tr>     <tr>         <td height="1" align="left" valign="bottom" colspan="2">     <div id="Layer1" style="visibility:hidden;"><font color="red" face="Arial"><span style="font-size:11pt;"><b>Bitte &uuml;berpr&uuml;fe noch einmal deine Eingaben!</b></span></font></div>

</td>     </tr>     <tr>         <td align="center" valign="middle" colspan="2" height="50"> <input type="image" src="zur-Vorschau.gif" width="190" height="30" border="0" onclick="hide('Layer1');hide('Layer2');hide('Layer3');hide('Layer4');hide('Layer5');hide('Layer6');hide('Layer7');hide('Layer8');hide('Layer9')" name="submit" value="zur Vorschau">

</td>     </tr> </table> </form>

[Matze]

Hi!

Um zwischen den Eingabefelder keinen Platz zu verschwenden, sollen die Felder, wenn keine Fehlermeldung vorhanden ist, hochgeschoben werden. Ist das möglich?

Sicher. Auch wenn ich nicht nachvollziehen kann was du meinst.

Hier ist das Script
[..]
// (C) 2002 Klaus Hentschel [ All rights reserved ].
// e-mail: [e-mail]
// www: http://www.javarea.de

Warum fragst du nicht erstmal hier nach?
Der Author des Scripts wirds dich sicher am besten beraten können.

Ich hoffe für die Sicherheit deiner Daten und Scripte, dass nach der JS-Prüfung noch eine Serverseitige Prüfung erfolgt.
Jede Clientseitige Prüfung ist manipulierbar und daher in meinen Augen sowieso in 90% aller Fälle überflüssig.

Grüße, Matze

[EKKi]

Mahlzeit Herbert1204,

zusätzlich von Matzes Hinweis möchte ich Dich darauf hinweisen, dass ein derart veraltetes Skript ...

// (C) 2002 Klaus Hentschel [ All rights reserved ].
// e-mail: [e-mail]
// www: http://www.javarea.de

... am besten *SOFORT* entsorgt werden sollte. Insbesondere, da es in keinster Weise auf heutige Browser Rücksicht nimmt, stattdessen auf spezielle Besonderheiten vorsintflutlicher Browser des letzten Jahrtausends eingeht.

Löschen, neu machen.

MfG,
EKKi