Autor |
Nachricht |
mavnet
Threadersteller
Dabei seit: 16.05.2011
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 09.06.2011 12:33
Titel Javascript Form Validation returne false funktioniert nicht |
|
|
Hallo allerseits,
vielleicht kann mir jemand bei meinem folgenden Problem weiterhelfen. Ich bin noch Anfänger in js und komme mit meiner form validation leider nicht weiter . Habe google bereits seitenweise durch, diverse tutorials gelesen und mozilla firebug spuckt nur aus, dass das Auslesen von Fehlern in meinem Code deaktiviert sei.
Da das mein erster Beitrag/Frage ist bitte ich vorab um Entschuldigung wenn es das Thema schon geben sollte, wobei ich unter der sufu nichts entsprechendes gefunden habe.
---
Zur Problembeschreibung:
Das folgende Formular soll mit js (später noch mit php) auf Richtigkeit überprüft werden. Bei Klick auf den submit-Button dann mit return false das Absenden des Formulares bei falscher Eingabe verhindert werden. Leider klappt das nicht, die form wird dennoch abgesandt. Habe mir das Formular aus Code-Schnippseln selbst zusammen gebastelt. Irgendwo muss ich grundlegend noch was falsch machen . Hat evtl jemand einen Rat?
Vielen Dank und Gruß,
Chris
|
|
|
|
|
mavnet
Threadersteller
Dabei seit: 16.05.2011
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 09.06.2011 12:36
Titel
|
|
|
js: Code: | <head>
<link href="css/content.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="reflection/reflection.js"></script>
<script type="text/javascript" src="js/jquery-1.5.2.js"></script>
<script language="JavaScript">
function geschlechtcheck()
{
if (document.forms[0].geschlecht.value == "0") {
$('#geschlechtfail').fadeIn();
return(false);
} else {
$('#geschlechtfail').fadeOut();
}
}
</script>
<script language="JavaScript">
function wohnl()
{
if (document.register.wohnort.value.length<2) {
$('#wohnfail').fadeIn();
return(false);
}
}
</script>
<script language="JavaScript">
function wohncheck()
{
var Zeichen="abcdefghijklmnopqrstuvwxyzäöüQWERTZUIOPÜASDFGHJKLÖÄYXCVBNM/- ", c, d, Eingabe, laenge;
Eingabe=window.document.register.wohnort.value;
laenge=Eingabe.length;
for (c=0; c<laenge; c++)
{
d=Eingabe.charAt (c);
if (Zeichen.indexOf (d)==-1)
{
$('#wohnfail').fadeIn();
return(false);
window.document.forms[0].elements[0].value="";
window.document.forms[0].elements[0].focus ();
break;
}else {
$('#wohnfail').fadeOut();
}
}
}
</script>
<script language="JavaScript">
function emailcheck()
{
var string1=document.register.email.value
if (string1.indexOf("@")==-1)
{
return(false);
$('#tickmail').hide();
$('#mailfail').fadeIn();
} else {
$('#mailfail').fadeOut();
$('#tickmail').fadeIn();
}
}
//-->
</script>
<script language="JavaScript">
function emaill()
{
if (document.register.email.value.length<4) {
$('#mailfail').fadeIn();
return(false);
} else {
$('#mailfail').fadeOut();
$('#tickmail').fadeIn();
}
}
</script>
<script language="JavaScript">
function emailcheck2()
{
var string1=document.register.email.value
if (string1.indexOf(".")==-1)
{
$('#tickmail').hide();
$('#mailfail').fadeIn();
return(false);
} else {
$('#mailfail').fadeOut();
$('#tickmail').fadeIn();
}
}
//-->
</script>
<script language="JavaScript">
function changeBtn(mode) {
switch(mode) {
case 0:
document.getElementById('submitbtn').src="./layout/regbutton_2.png " ;
break;
case 1:
document.getElementById('submitbtn').src = "./layout/regbutton_1.png " ;
break;
}
}
</script>
<script language="JavaScript">
function pseudol()
{
if (document.register.pseudonym.value.length<3) {
$('#pseudolfail').fadeIn();
return(false);
}
}
</script>
<script language="JavaScript">
<!--
function emailcheck()
{
var string1=document.register.email.value
if (string1.indexOf("@")==-1)
{
$('#tickmail').hide();
$('#mailfail').fadeIn();
return(false);
} else {
$('#mailfail').fadeOut();
$('#tickmail').fadeIn();
}
}
//-->
</script>
<script language="JavaScript">
function psw()
{
if (document.register.password.value.length<6) {
$('#tickpass').hide();
$('#fehlerpasswordzeichen').fadeIn();
return(false);
} else {
$('#fehlerpasswordzeichen').fadeOut();
$('#tickpass').fadeIn();
}
}
</script>
<script language="JavaScript">
function plzcheck()
{
if (document.register.plz.value.length<5) {
$('#tickplz').hide();
$('#failplz').fadeIn();
return(false);
} else {
$('#failplz').fadeOut();
$('#tickplz').fadeIn();
}
}
</script>
<script language="JavaScript">
var oldstring
function CheckNumbers(obj) {
var text = obj.value;
if(isNaN(text)==true){
obj.value=oldstring;
}else {
oldstring=text;
if(text=="" || text=="undefined") {
text="";
}
}
}
</script>
<script type="text/javascript" src="js/jquery-1.5.2.js"></script>
<script language="JavaScript">
<!--
// Menü-Buttons vorladen
var mann2 = new Image();
mann2.src = "./layout/mann2.png";
var mann1 = new Image();
mann1.src = "./layout/mann1.png";
var frau2 = new Image();
frau2.src = "./layout/frau2.png";
var frau1 = new Image();
frau1.src = "./layout/frau1.png";
function bildwechsel ( name, bild ) {
document.images[name].src = bild.src;
}
$(document).ready(function(){
$('#pseudonym').keyup(pseudonym_check);
});
function pseudonym_check(){
var pseudonym = $('#pseudonym').val();
if(pseudonym == "" || pseudonym.length < 3){
$('#pseudonym').css('border', '3px #CCC solid');
document.register.pseudonym.focus();
return(false);
$('#tick').hide();
}else{
$('#pseudolfail').fadeOut();
jQuery.ajax({
type: "POST",
url: "check_pseudonym.php",
data: 'pseudonym='+ pseudonym,
cache: false,
success: function(response){
if(response == 1){
$('#tick').fadeOut();
$('#cross').fadeIn();
$('#fehlermeldungvergeben').fadeIn();
document.register.pseudonym.focus();
return(false);
}else{
$('#cross').hide();
$('#tick').fadeIn();
$('#fehlermeldungvergeben').fadeOut();
}
}
});
}
}
-->
</script>
|
|
|
|
|
|
Anzeige
|
|
|
mavnet
Threadersteller
Dabei seit: 16.05.2011
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 09.06.2011 12:37
Titel
|
|
|
Form: Code: |
<form id="register" name="register" action="" method="post" onSubmit=" return emaill() || wohnl() || pseudol() || geschlechtcheck() || wohncheck () || emailcheck() || emailcheck2() || psw() || plzcheck() || pseudonym_check() " enctype="text/html">
<fieldset>
<legend align="center"><img src="layout/anmelden.png" width="211" height="17"></legend>
<br>
<label for="geschlecht" onchange="javascript:formHandler()" onsubmit="geschlechtcheck()">Geschlecht:</label>
<select onBlur="geschlechtcheck()" name="geschlecht" class="textarea">
<option value="0" >Bitte wählen </option>
<option value="frau" onClick="bildwechsel('frau', frau2); bildwechsel('mann', mann1)">weiblich</option>
<option value="mann" onClick="bildwechsel('mann', mann2); bildwechsel('frau', frau1)">männlich</option>
</select>
<div id="geschlechtfail">Bitte ein Geschlecht angeben.</div>
<p>
<label for="pseudonym">Pseudonym:</label>
<input name="pseudonym" type="text" class="textarea" id="pseudonym" onBlur="pseudol()" value="" size="18" maxlength="13" />
<img id="tick" src="./layout/tick.png" width="16" height="16"/><img id="cross" src="./layout/cross.png" width="16" height="16"/>
<div id="fehlermeldungvergeben">Pseudonym schon vergeben.</div><div id="pseudolfail">Bitte ein Pseudonym mit mindestens 3 Zeichen eingeben.</div>
<p>
<label for="passwort">Passwort wählen:</label>
<input name="password" type="password" class="textarea" id="password" onBlur="psw()" value="" size="18" maxlength="13" />
<img id="tickpass" src="layout/tick.png" width="16" height="16">
<div id="fehlerpasswordzeichen">Bitte ein Passwort mit mindestens 6 Zeichen eingeben.</div>
<p>
<label for="geburtsdatum">Geburtsdatum:</label>
<?php
//für Tag
echo "\n<select name=\"d\" class=textarea>\n";
for($i=1;$i<=31;$i++) {
echo "\t<option value=\"". $i ."\" >". $i ."</option>\n"; }
echo "</select>\n";
//für Monat
$Monate = array(0 => "ungültig",
1 => "Januar",
2 => "Februar",
3 => "März",
4 => "April",
5 => "Mai",
6 => "Juni",
7 => "Juli",
8 => "August",
9 => "September",
10 => "Oktober",
11 => "November",
12 => "Dezember");
echo "\n<select name=\"m\" class=textarea>\n";
for($i=0;$i<=12;$i++) {
echo "\t<option value=\"". $i ."\">". $Monate[$i+1] ."</option>\n"; }
echo "</select>\n";
//für Jahr
echo "\n<select name=\"y\" class=textarea>\n";
for($i=1920;$i<=2007;$i++) {
echo "\t<option value=\"". $i ."\">". $i ."</option>\n"; }
echo "</select>\n";
?>
<p>
<label for="email">E-Mail Adresse:</label>
<input name="email" type="text" class="textarea" id="email" onBlur="emailcheck();emailcheck2()" value="" size="25" maxlength="40" />
<img id="tickmail" src="layout/tick.png" width="16" height="16">
<div id="mailfail">Bitte eine gültige E-Mail Adresse eingeben.</div>
<p>
<label for="plz">Postleitzahl:</label>
<input name="plz" type="text" class="textarea" id="plz" onBlur="plzcheck()" onKeyDown="javascript:CheckNumbers(this)" onKeyUp="javascript:CheckNumbers(this)" value="" size="5" maxlength="5" />
<img id="tickplz" src="layout/tick.png" width="16" height="16">
<div id="failplz">Bitte eine gültige Postleitzahl eingeben.</div>
<p>
<label for="wohnort">Wohnort:</label>
<input name="wohnort" type="text" class="textarea" id="wohnort" onBlur="wohnl()"onKeyUp="wohncheck()" value="" size="18" maxlength="25" />
<div id="wohnfail">Bitte einen gültigen Wohnort eingeben.</div>
</p>
<p> </p>
<p> </p>
<input type="image" src="layout/regbutton_1.png" class="regbutton" id="submitbtn" onClick="return emaill() || pseudonym_check() || wohnl() || pseudol() || geschlechtcheck() || wohncheck() || emailcheck() || emailcheck2() || psw() || plzcheck() || wohnl() ;" onmouseover=changeBtn(0); onmouseout=changeBtn(1); name="" value="jetzt senden" />
<br>
<br>
<br>
</fieldset>
</p>
</p>
</form>
</div>
</body>
</html>
|
|
|
|
|
|
mavnet
Threadersteller
Dabei seit: 16.05.2011
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 09.06.2011 12:40
Titel
|
|
|
Wollte ergänzend noch sagen, dass ich natürlich nicht erwarte, dass sich jemand den ganzen "Roman" von oben nach unten auf das genauste durchliest, nur halt evtl Fehler die gleich auffallen bzw. vielleicht eine falsche Vorgehensweise
Ich habe schon probiert:
- return (false) anstatt nur return und dann funktionsname
- alles in eine funktion zu schreiben
Zuletzt bearbeitet von mavnet am Do 09.06.2011 12:51, insgesamt 1-mal bearbeitet
|
|
|
|
|
Alex
Dabei seit: 28.11.2005
Ort: Dortmund
Alter: 37
Geschlecht:
|
Verfasst Do 09.06.2011 13:41
Titel
|
|
|
Online stellen (falls noch nicht) und Link hier rein stellen.
Ich glaube die wenigsten haben Lust sich das Konstrukt nach zu bauen...
|
|
|
|
|
mavnet
Threadersteller
Dabei seit: 16.05.2011
Ort: -
Alter: -
Geschlecht:
|
Verfasst Do 09.06.2011 17:15
Titel
|
|
|
Wohl wahr !!
Hier der Link:
http://mavnet.de/mg/startreg.php
Folgendes passiert:
Wenn alle Felder leer sind und es wird auf Registrieren geklickt, scheint er alle Werte korrekt als false zurück zu geben.
Werden dann alle Felder bis auf eines ausgefüllt (z.B. Passwort bleibt leer), dann schickt er es dennoch ab...
|
|
|
|
|
DerM
Dabei seit: 18.01.2009
Ort: -
Alter: 42
Geschlecht:
|
Verfasst Do 09.06.2011 17:31
Titel
|
|
|
Da Du ja eh schon jquery nutzt.
Code: |
$('#deineFormId').submit(function(){
var error = false;
// Routine zum checken der Felder hier eintragen
// .....
// .....
// Falls ein Fehler vorliegt error = true;
// Falls kein Fehler vorliegt
if(!error) {
// Routine zum absenden des Formulars
// Return True -- Keine Fehler vorhanden
return true;
}
else {
// Routine zum Errorhandling
// Nichts zurückgeben bzw. false - Da Fehler
return false;
}
});
|
Ich hoffe das ist verständlich
Hier noch was zum lesen.
http://api.jquery.com/submit/
Zuletzt bearbeitet von DerM am Do 09.06.2011 17:32, insgesamt 1-mal bearbeitet
|
|
|
|
|
mavnet
Threadersteller
Dabei seit: 16.05.2011
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 10.06.2011 13:58
Titel
|
|
|
Vorab schonmal vielen Dank für die Hilfe!
Werd es jetzt mal probieren umzusetzen !
|
|
|
|
|
|
|
|
Ähnliche Themen |
[Javascript] form validation
Form Validation
Spry in Dreamweaver CS3 funktioniert nicht im IE -> false
[JavaScript] - Form Type Abfrage
[JavaScript/PHP] Form Abhängig von Eingabe füllen lassen
Per JavaScript Submit Button für Form generieren lassen
|
|