How do I perform a phone number look up before form is submitted?


I have a form that ask for the phone number   area core - prefix - number

<input name="AHPhone" type="text"  size="3" maxlength="3" onKeyup="autotab(this, document.form.HPhone1)">
   -                           <input name="HPhone1" type="text"  size="3" maxlength="3" onKeyup="autotab(this, document.form.HPhone2)">
                          <input name="HPhone2" type="text"  size="4" maxlength="4" onKeyup="autotab(this, document.form.AWPhone)">

I also have a database containing a table with all the US/Canada area codes and prefixes. I want to validate the phone number input of the user BEFORE submiting the form. I need to validate that the area code exist on the area_code field from the table and the prefix also exist. Also that the prefix correspond to that area code.

I'm using cf.  Is it posssible to include a <cfquery> within a javascript function?
gaby22Asked:
Who is Participating?
 
mrichmonCommented:
Okay well if you already have that then you really already have the test.

You would do something like this :

<cfset ErrorFlag = false>
<cfif IsDefined("Form.submitbtn")>
     <cfset dacode = left(Hphone,3)> <!--- notice you don't need the quotes nor the # here in the cfsets --->
     <cfset recprefix = mid(Hphone,4,3)><!--- notice you don't need the quotes nor the # here in the cfsets --->

     <CFQUERY datasource="codespref" name="codes">
          SELECT *FROM rightcodes WHERE areacode = '#dacode#' and prefix = '#recprefix#'
       </CFQUERY>
      <cfif codes.RecordCount EQ 0>
         <cfset ErrorFlag = true>
      </cfif>
     <cfif NOT ErrorFlag>
        process form hereand do a cflocation to next page when done
     </cfif>
</cfif>

<html>
<head><title>Test Phone NUmber Page</title></head>
<body>
<form name="testphone" method="post" action="thispage.cfm">
  <cfif ErrorFlag>Please enter a valid phone number including areacode and prefix</cfif>
  Phone Number: <input name="HPhone" type="text" value="<cfif ErrorFlag>#Form.HPhone#</cfif>">
   <input type="submit" name="submitbtn" value="Test">
</form>
</body>
</html>
0
 
mrichmonCommented:
No You can't include a cfquery within javascript - javascript runs client side and cold fusion runs server side.

You can however validate after submitting the form - or by using a javascript iFrame to perform a background submit of just the phone number to validate it.

But in either case it will be submitted before it can be validated.
0
 
gaby22Author Commented:
How do I perform a javascript iFrame? Will it check in the BD if the phone number is OK?
0
Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

 
mrichmonCommented:
Look at this thread where I explained how to do this:

http:Q_20936125.html


Basically what happens is that the iFrame submits to a cold fusion page in the background and does whatever checks you want against the database.  Then it sends back to the iFrame the results and the iFrame puts an error message on the page or even a success message...
0
 
gaby22Author Commented:
Are you sure there is not any other simpler way to do this? I'm lost. Could this be an option:  making a query at the begining of the page, storing the the area code values in a list and comparing the user's  imput against the list values?  
0
 
mrichmonCommented:
You could, but since you would have to store all the DB contents (i.e. all the posibilities) this could be huge.

I would recommend as teh simplest solution

1) User enters phone number on form
2) User submits form
3) In cold fusion you compare by doing queries to make sure it is correct - if so continue - otherwise send them back to the page with an error message.

Using this method you can re-fill in the form so that the only difference is that the error is displayed.

This is the easiest way to do this BUT it does require submitting the form.
0
 
Tacobell777Commented:
The cfinput tag might be of help
<cfinput name="telephone" type="text" required="no" validate="telephone">
remember it needs to be in a cfform tag..
0
 
Tacobell777Commented:
Yes cfform is bad for expert programmers, but not for other people out there that want it done the easy way.
0
 
mrichmonCommented:
but he doesn't want just is it a valid format - gaby wants to validate it against a database of known area codes - this cannot be done with cfform.
0
 
Tacobell777Commented:
Why does this check need to be done on the client side? It not foul proof doing it this way, do it on the server-side there is nothing wrong with doing it on the server-side and you save yourself a lot of time and hassles working with JS and iFrames.
0
 
Tacobell777Commented:
<cfset result = reFindNocase("\d*\s*Results Found", string, 1, "true")>

<cfdump var="#result#">

Use mid to retrieve the string found
0
 
Tacobell777Commented:
oops wrong thread...
0
 
mrichmonCommented:
yep that was my recommendation - do it server side  notice my comments that emphasize "the easiest way to do this does require submitting the form"

The only reason I mentioned iFrames was as an alternative that would not submit the whole form as that is what was originally asked, but I still think the best method is to just submit the form and then re-create it if there is a problem.
0
 
usankarCommented:
gaby22 - here is what you wanted
do a query to list down all the US and cananda area codes and prefixes, concatenate them with a separator and store them as a form hidden field in your form
<input type="USprefix" value="123,234,827,2828">
<input type="Canadaprefix" value="123,234,827,2828">

Once the user keys in the area code and leaves the field, cross check against the US and canada hidden fields using javascript,
If valid then allow further, not throw error message accordingly.
Hope this helps
0
 
mrichmonCommented:
I mentioned in earlier comments that this could be done (actually it would be better to store in a javascript variable instead of a hidden form field), but if the database of areacodes is huge then you are vastly increasing the page size AND it is a slow process to search to findthe areacode you need to validate against.

The best method is just to submit...
0
 
gaby22Author Commented:
Thank you mrichmon for all the info.  I'm trying to implement the iFrame solution. However I don't know how to send the value of the area code "and" the prefix to be validated against the db.
<input name="AHPhone" type="text">                  
<input name="HPhone1" type="text">

I see that the function send "i" as value Can I send the 2 inputs?
0
 
mrichmonCommented:
The reason I send I is that I dynamically name the inputs.  If you know that the inputs will be named AHPhone and HPhone then you don't need to send i at all.

Your function would look something like :

function LookupAreacode()
{
     var Areacode= document.formname.AHPhone.value;
     var prefix = document.formname.HPhone1.value;
         
     if (areacode != "")
     {     // If an areacode was entered then look it up in our DB
          callToServer("RPC_AreacodeLookup.cfm?AHPhone=" + escape(Areacode) + "&HPhone1=" + escape(prefix));
     }
}

Be sure to replace the "formname" with your form's actual name
0
 
gaby22Author Commented:
If I want to validate after submiting, what will be the approach??..How do I populate the fields if I need to ask the user to re-enter the phone number.
0
 
mrichmonCommented:
The validation approach would be something like

Look at the submitted area code and prefix.  Run a query against your database to verify that these are correct areacodes and prefixes.  If so then continue with submit.  If not then set an errorflag and redraw the page  Then ont he page you would populate the fields like this :

<input name="firstname" type="text" value="<cfif ErrorFlag>#Form.firstname#</cfif>">

which would put back the value that had been there
0
 
gaby22Author Commented:
Can anybody give me a sample code to do a server-side validation of the phone number? It needs to query an area code/prefixes db and return to the form if were not found. Pre-fill the fields with the data already entered....Should I post this on a new question??
0
 
mrichmonCommented:
Well what does the database that stores this information look like?
0
 
gaby22Author Commented:
This is the query I'm using to check phone numbers already in file.
<cfset dacode = "#left(Hphone,3)#">
<cfset recprefix = "#mid(Hphone,4,3)#">

<CFQUERY datasource="codespref" name="codes">
SELECT *
FROM rightcodes
WHERE areacode = '#dacode#' and prefix = '#recprefix#'
</CFQUERY>
<cfif codes.RecordCount EQ 0>
<cfset mess = "Bad Phone" >
 <cfelse>
<cfset mess = "OK" >
</cfif>
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.