fUnKuCh3n
Erfahrenes Mitglied
Hallo,
ich habe mir nachfolgendes Script geschrieben, dass zu erst überprüft ob die im <input> Feld eingetragene E-Mailadresse eine Syntaxmäßig korrekt ist und dann mittels AJAX Request an die DB ob di E-Mailadresse bereits eingetragen ist. Sollte die E-Mail nicht korrekt sein, soll für das Submit Feld das Flag disabled="disabled" gesetzt werden, ist die Email bereits eingetragen soll ebenfalls das disabled="disabled" gesetzt werden.
Aber scheinbar habe ich da noch nen Denkfehler, denn ich kann das Formular auch abschicken wenn die E-Mail unvollständig ist.
Der jQuery/JS Code:
Der dazugehörige HTML Code:
Vielleicht könnt ihr mir ja helfen? Außerdem habe ich auch relativ lange getestet es so zu machen, dass erst wenn die E-Mail korrekt ist die AJAX Anfrage an die DB geschickt wird.
Liebe Grüße
ich habe mir nachfolgendes Script geschrieben, dass zu erst überprüft ob die im <input> Feld eingetragene E-Mailadresse eine Syntaxmäßig korrekt ist und dann mittels AJAX Request an die DB ob di E-Mailadresse bereits eingetragen ist. Sollte die E-Mail nicht korrekt sein, soll für das Submit Feld das Flag disabled="disabled" gesetzt werden, ist die Email bereits eingetragen soll ebenfalls das disabled="disabled" gesetzt werden.
Aber scheinbar habe ich da noch nen Denkfehler, denn ich kann das Formular auch abschicken wenn die E-Mail unvollständig ist.
Der jQuery/JS Code:
Javascript:
/*email validation*/
function isValidEmailAddress(emailAddress) {
var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
return pattern.test(emailAddress);
}
$(document).ready(function() {
/*validate the mail if its an correct mail*/
$("#email").keyup(function(){
var email = $("#email").val();
if(email != 0)
{
if(isValidEmailAddress(email))
{
$("#submit").attr('disabled','');
$("#notification").html(" ");
}
else
{
$("#submit").attr('disabled','disabled');
$("#notification").html('Ungültige E-Mail.');
}
}
else
{
$("#submit").attr('disabled','disabled');
}
});
/*instant check if email exists*/
var myForm = $("#newsletter"), email = $("#email"), emailInfo = $("#emailInfo");
//send ajax request to check email
email.blur(function(){
$.ajax({
type: "POST",
data: "email="+$(this).attr("value"),
url: "inc/check.php",
success: function(data){
if(data != "0")
{
$("#submit").attr('disabled','disabled');
$("#notification").html("E-Mail bereits vorhanden.");
}
else
{
$("#submit").attr('disabled','');
$("#notification").html(" ");
}
}
});
});
});
Der dazugehörige HTML Code:
HTML:
<div id="newsletter">
<form action="" id="newsletter" method="post">
<p class="newsletter">Newsletter abonnieren:</p>
<input type="text" style="float:left;" class="textbox" value="E-Mail..." name="email" id="email" onfocus="if(this.value == this.defaultValue) this.value = '';" onblur="if(!this.value) this.value = this.defaultValue;"/>
<input style="border:0;float:left;" disabled="disabled" type="image" id="submit" src="graphic/content/button.png" alt="Absenden" onclick="register()"/>
<div id="notification"></div>
<div class="clear"></div>
</form>
</div>
Vielleicht könnt ihr mir ja helfen? Außerdem habe ich auch relativ lange getestet es so zu machen, dass erst wenn die E-Mail korrekt ist die AJAX Anfrage an die DB geschickt wird.
Liebe Grüße