Evaluating cfform input with the use of CFAJAXPROXY and JQUERY
I want to evaluate the input of an email field with the database that I have to see if a user hasn't already registered and if the email is a valid one.
This is what my form looks like:
<cfform action="#application.siteurl#/?#cgi.QUERY_STRING#" method="post">
<tr>
<td class="pad-content">E-mail:<font color="red">*</font></td>
<td><cfinput type="text" name="Email" required="yes" validate="email" message="E-mailaddress incorrect">
</td>
<td align="left" width="120" id="validEmail" class="validEmailneutral"></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" id="submitButton" value=" Register " /></td>
<td> </td>
</tr>
</cfform>
</table>
The 3rd cell of the email-row is now empty and has a specific id and class applied. That makes controlling it through JQuery easy, since I can lookup the ID and just change it's class and content.
At the top of my page, this is my CFAJAXPROXY and my JQuery script:
<script language="javascript">
function callbackHandler(result){
if(result=='NONEXIST'){
$("#validEmail").html("<img src='/img/Icon_OK.gif' hspace=10>Valid e-mail").removeClass().addClass("validEmailOK");
$("#submitButton").show();
}else if(result=='NONVALID'){
$("#validEmail").html("<img src='/img/Icon_NOK.gif' hspace=10>Invalid e-mail").removeClass().addClass("validEmailNOK");
$("#submitButton").hide();
}else if(result=='EXIST'){
$("#validEmail").html("<img src='/img/Icon_NOK.gif' hspace=10>E-mail exists").removeClass().addClass("validEmailNOK");
$("#submitButton").hide();
}
}
</script>
This gives my three options: my com.users CFC component returns one of three values, NONEXIST, NONVALID or EXIST. The first sets a green box with an OK icon and a "valid e-mail" text, the other 2 are red and tell the user the emailaddress isn't an emailaddress or the address is in use already.
My checkEmail function looks like this:
<cfargument name="Email" type="string" required="yes">
<cfif arguments.Email DOES NOT CONTAIN "@" or arguments.email does not contain ".">
<cfreturn "NONVALID">
<cfelse>
<cfquery datasource="#application.dsn#" name="lookupMail">
SELECT Email FROM tblContacts
WHERE Email = '#arguments.email#'
</cfquery>
<cfif lookupMail.recordcount>
<cfreturn "EXIST">
<cfelse>
<cfreturn "NONEXIST">
</cfif>
</cfif>
</cffunction>
My emailvalidation is a bit clunky, but it's fast and easy, and just does a simple check for "@" and a ".", that's all I need for now. I could do with a regular expression to check for a valid email, but I leave that check to the "cfinput validate=email" part.
There are no comments for this entry.
[Add Comment]