checking an email uniqueness before submitting a sign up form_问答_开发者

checking an email uniqueness before submitting a sign up form

开发者 https://www.devze.com 2023-03-03 18:09 出处：网络

I\'ve got trouble with checking an email uniqueness in the client side before submit开发者_如何学编程ting a sign up form to the server side.

I've got trouble with checking an email uniqueness in the client side before submit开发者_如何学编程ting a sign up form to the server side.

submitButton.onclick = function(){
    var email = $('input[name = "email"]').val();
    var checkEmail;
    $.ajax({
        url: 'serverScripts/settings/checkEmailAvailability.php',
        data: {email: email},
        async: false,
        success: function(text){
            checkEmail = text;//Return "occupied" or "freeToUse"
        }
    });
    if(checkEmail == 'occupied'){
        return false;
    }
}

Your script at : serverScripts/settings/checkEmailAvailability.php

is expecting a variable called "email"

your php script then should query the db and test if its available or not and return "occupied" if it's in the db .

else it's a valid email address to use.

I suspect it is your naming of the variables. See this section:

$.ajax({
    url: 'serverScripts/settings/checkEmailAvailability.php',
    data: {email: email},
    async: false,
    success: function(text){
        checkEmail = text;//Return "occupied" or "freeToUse"
    }
});

It probably should be

data: {'email': email},

notice the quotes. As it stands, you are creating a data element of

{joe.blow@email.com, joe.blow@email.com}

while it should be

{email: joe.blow@email.com}

I decided to do that script correctly:

<!DOCTYPE html>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<form action="javascript:alert('it went though pipes')" method="get">
<input type="email" name="email">
<input type="submit" name="submitButton" id="submitButton">
</form>
<script>
$('form').submit(function(){
    var email = $('input[name = "email"]').val();
    var checkEmail = $.ajax({
        url: 'serverScripts/settings/checkEmailAvailability.php',
        data: {email: email},
        async: false,
        success: function(data) {
            result = data;
        }
    });
    if(result.search('occupied')!=-1){
        alert("You've done something WRONG");
        return false;
    }
})
</script>

Now maybe some explanation. It uses jQuery. The <form action="..."> is just for fun, replace it will real address and feel free to insert <form> into real page. Now what was wrong? text is reserved in JS, you cannot use it, so I changed it to data. Also, I decided to use .search while searching for "occupied" and change the method which you use onsubmit a little :P.

I made quick testing page, if you're interested: (the only accepted is pass@me.com if you want to know).

http://glitchmr.pl/nuda/test.html

(also, $.ajax is specific to jQuery, if you don't use it already)