jQuery JSON validation for username before continuing with Facebook registration...
OK, heres the thing...
I am integrating facebook login into my website... Its all working, except i have yet to validate the fields on the registration form.
ie: all of the following work...
Facebook login,
facebook registration
the only problem being -> if the username is taken on my server, the registration errors...
However, facebook thinks that the user is registered still... so it wont direct to the register page, but instead login, I set the cookie for the user (or attempt to) but validation says its not a valid user so wont accept the login... and it can become a big circle... etc
so i found out about the async validation...
and it seems to work ok... except it says my json return is causing a parse error...
my PHP webcode:
PHP Code:
function CheckUsername($reqname){
global $facebook, $clsUser, $dbi, $user_prefix, $prefix;
$result = sql_query("SELECT user_id, facebook, email_address, password FROM ".$user_prefix
."user_account WHERE username='".addslashes($reqname)."'",$dbi);
if(sql_num_rows($result,$dbi)>0){
$data = "Taken";
} else {
$data = "Free";
}
header("Content-Type: application/json");
// tried it with and without the [ square brackets...
echo "[{\n";
echo "\"username\": ".json_encode($data)."\n";
echo "}]";
exit;
}
which outputs (as a download file... due to the content headers)
Code:
{
"username": "Taken"
}
the json request is:
Code:
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function validate_async(form, cb) {
console.log("We are in the validate_async box...");
//if(form.username.length<3){
// console.log("the username length is less than 3 chars");
// cb("username: Username length must be longer than 3 chars.");
//}else{
// TODO: check password is ok before proceeding...
console.log("Fetching the username '"+form.username+"'");
$.getJSON('http://domain.com/member/fb_login.php?op=CheckUsername&username=' + form.username,
function(response) {
console.log( "first finish routine? ");
})
.done(function(response) {
console.log( "second success ( .done() )" );
console.log("We are checking the response...'"+response.username+"'");
if (response.username == "Free") {
// Username isn't taken, let the form submit
//cb();
console.log("error is true???");
//call back
cb();
}
console.log("We are displaying username error...");
cb({username: 'That username is taken, Sorry!'});
})
.fail(function(response, textstatus, errorresult) {
console.log( "error ( .fail() ) response: " +response );
console.log( "error ( .fail() ) textstatus: " +textstatus );
console.log( "error ( .fail() ) errorresult: " +errorresult );
cb({username: 'We failed to check the username...'});
})
.always(function(response) {
console.log( "complete ( .always() )" );
});
//}
console.log("exiting the validate_async");
}
</script>
<div style="float:right;">
<div class="fb-registration" data-fields='[
{"name":"name"},
{"name":"first_name"},
{"name":"last_name"},
{"name":"email"},
{"name":"location"},
{"name":"username","description":"Username for our website","type":"text"},
{"name":"password"},
{"name":"captcha"},
{"name":"newsletter","description":"Subscribe to our newsletter?","type":"checkbox"}
]'
data-redirect-uri="<?php echo FB_SITEBASE; ?>/members/fb_login.php?op=do_register"
width="300" onvalidate="validate_async">
</div></div>
the webpage itself works... - ive tried it using browser, and tested the output on a validator which says its ok...
but, the output on my console is:
Quote:
LOG: We are in the validate_async box...
LOG: Fetching the username 'eee'
LOG: exiting the validate_async
LOG: error ( .fail() ) response: [object Object]
LOG: error ( .fail() ) textstatus: parsererror
LOG: error ( .fail() ) errorresult: [object Error]
LOG: complete ( .always() )
LOG: We are in the validate_async box...
LOG: Fetching the username 'eee'
LOG: exiting the validate_async
LOG: error ( .fail() ) response: [object Object]
LOG: error ( .fail() ) textstatus: parsererror
LOG: error ( .fail() ) errorresult: [object Error]
LOG: complete ( .always() )
anyone got any ideas?
Re: jQuery JSON validation for username before continuing with Facebook registration.
ahh crap... how stupid do i feel after about five hours of coding...
turns out... my url was wrong :( - my URL should of been "/members/" not "/member/" ...
however... - > how do i get the username text using this json from the response...? cheers
Re: jQuery JSON validation for username before continuing with Facebook registration.
PHP Code:
//...
if(sql_num_rows($result,$dbi)>0){
$data['username'] = "Taken";
} else {
$data['username'] = "Free";
}
header("Content-Type: application/json");
echo json_encode($data);
exit;
//....
See if this helps. :wave: