Linto's Blog

Just another WordPress.com weblog

Javascript code for formatting the phone number like (xxx)xxx-xxxx or (xxx) xxx-xxxx November 9, 2011

Filed under: Javascript — linodavis @ 5:35 pm

Link : http://javascript.internet.com/forms/format-phone-number.html

Script  FOR   (xxx)xxx-xxxx

=======
<HEAD>

<SCRIPT LANGUAGE=”JavaScript”>

<!– This script and many more are available free online at –>
<!– The JavaScript Source!! http://javascript.internet.com –>
<!– Original:  Roman Feldblum (web.developer@programmer.net) –>

<!– Begin
var n;
var p;
var p1;
function format_phone(){
p=p1.value
if(p.length==3){
pp=p;
d4=p.indexOf(‘(‘)
d5=p.indexOf(‘)’)
if(d4==-1){
pp=”(“+pp;
}
if(d5==-1){
pp=pp+”)”;
}
document.form4.phone_number.value=”";
document.form4.phone_number.value=pp;
}
if(p.length>3){
d1=p.indexOf(‘(‘)
d2=p.indexOf(‘)’)
if (d2==-1){
l30=p.length;
p30=p.substring(0,4);
p30=p30+”)”
p31=p.substring(4,l30);
pp=p30+p31;
document.form4.phone_number.value=”";
document.form4.phone_number.value=pp;
}
}
if(p.length>5){
p11=p.substring(d1+1,d2);
if(p11.length>3){
p12=p11;
l12=p12.length;
l15=p.length
p13=p11.substring(0,3);
p14=p11.substring(3,l12);
p15=p.substring(d2+1,l15);
document.form4.phone_number.value=”";
pp=”(“+p13+”)”+p14+p15;
document.form4.phone_number.value=pp;
}
l16=p.length;
p16=p.substring(d2+1,l16);
l17=p16.length;
if(l17>3&&p16.indexOf(‘-’)==-1){
p17=p.substring(d2+1,d2+4);
p18=p.substring(d2+4,l16);
p19=p.substring(0,d2+1);
pp=p19+p17+”-”+p18;
document.form4.phone_number.value=”";
document.form4.phone_number.value=pp;
}
}

setTimeout(format_phone,100)
}
function getIt(m){
n=m.name;
p1=m
format_phone()
}

//  End –>
</script>

</HEAD>

<!– STEP TWO: Copy this code into the BODY of your HTML document  –>

<BODY>

<div align=”center”>
<form name=”form4″>
<font size=”4″ color=”#0000FF”><b>Enter Telephone Number</b></font><br>
(To refresh, hold down shift and press the browser refresh button)<br>
<input type=text name=”phone_number” id=”phone_number” maxlength=”13″ onclick=”javascript:getIt(this)” >
</form>
</div>

<p><center>
<font face=”arial, helvetica” size”-2″>Free JavaScripts provided<br>
by <a href=”http://javascriptsource.com”>The JavaScript Source</a></font>
</center><p>

<!– Script Size:  2.70 KB –>

http://www.kodyaz.com/articles/javascript-phone-format-phone-number-format.aspx

FOR   (xxx) xxx-xxxx

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>Untitled Document</title>
<script language=”javascript”>

<!– This script is based on the javascript code of Roman Feldblum (web.developer@programmer.net) –>
<!– Original script : http://javascript.internet.com/forms/format-phone-number.html –>
<!– Original script is revised by Eralper Yilmaz (http://www.eralper.com) –>
<!– Revised script : http://www.kodyaz.com –>
<!– Format : “(123) 456-7890″ –>

var zChar = new Array(‘ ‘, ‘(‘, ‘)’, ‘-’, ‘.’);
var maxphonelength = 14;
var phonevalue1;
var phonevalue2;
var cursorposition;

function ParseForNumber1(object){
phonevalue1 = ParseChar(object.value, zChar);
}

function ParseForNumber2(object){
phonevalue2 = ParseChar(object.value, zChar);
}

function backspacerUP(object,e) {
if(e){
e = e
} else {
e = window.event
}
if(e.which){
var keycode = e.which
} else {
var keycode = e.keyCode
}

ParseForNumber1(object)

if(keycode >= 48){
ValidatePhone(object)
}
}

function backspacerDOWN(object,e) {
if(e){
e = e
} else {
e = window.event
}
if(e.which){
var keycode = e.which
} else {
var keycode = e.keyCode
}
ParseForNumber2(object)
}

function GetCursorPosition(){

var t1 = phonevalue1;
var t2 = phonevalue2;
var bool = false
for (i=0; i<t1.length; i++)
{
if (t1.substring(i,1) != t2.substring(i,1)) {
if(!bool) {
cursorposition=i
window.status=cursorposition
bool=true
}
}
}
}

function ValidatePhone(object){

var p = phonevalue1

p = p.replace(/[^\d]*/gi,”")

if (p.length < 3) {
object.value=p
} else if(p.length==3){
pp=p;
d4=p.indexOf(‘(‘)
d5=p.indexOf(‘)’)
if(d4==-1){
pp=”(“+pp;
}
if(d5==-1){
pp=pp+”)”;
}
object.value = pp;
} else if(p.length>3 && p.length < 7){
p =”(” + p;
l30=p.length;
p30=p.substring(0,4);
p30=p30+”) “

p31=p.substring(4,l30);
pp=p30+p31;

object.value = pp;

} else if(p.length >= 7){
p =”(” + p;
l30=p.length;
p30=p.substring(0,4);
p30=p30+”) “

p31=p.substring(4,l30);
pp=p30+p31;

l40 = pp.length;
p40 = pp.substring(0,9);
p40 = p40 + “-”

p41 = pp.substring(9,l40);
ppp = p40 + p41;

object.value = ppp.substring(0, maxphonelength);
}

GetCursorPosition()

if(cursorposition >= 0){
if (cursorposition == 0) {
cursorposition = 2
} else if (cursorposition <= 2) {
cursorposition = cursorposition + 1
} else if (cursorposition <= 4) {
cursorposition = cursorposition + 3
} else if (cursorposition == 5) {
cursorposition = cursorposition + 3
} else if (cursorposition == 6) {
cursorposition = cursorposition + 3
} else if (cursorposition == 7) {
cursorposition = cursorposition + 4
} else if (cursorposition == 8) {
cursorposition = cursorposition + 4
e1=object.value.indexOf(‘)’)
e2=object.value.indexOf(‘-’)
if (e1>-1 && e2>-1){
if (e2-e1 == 4) {
cursorposition = cursorposition – 1
}
}
} else if (cursorposition == 9) {
cursorposition = cursorposition + 4
} else if (cursorposition < 11) {
cursorposition = cursorposition + 3
} else if (cursorposition == 11) {
cursorposition = cursorposition + 1
} else if (cursorposition == 12) {
cursorposition = cursorposition + 1
} else if (cursorposition >= 13) {
cursorposition = cursorposition
}

var txtRange = object.createTextRange();
txtRange.moveStart( “character”, cursorposition);
txtRange.moveEnd( “character”, cursorposition – object.value.length);
txtRange.select();
}

}

function ParseChar(sStr, sChar)
{

if (sChar.length == null)
{
zChar = new Array(sChar);
}
else zChar = sChar;

for (i=0; i<zChar.length; i++)
{
sNewStr = “”;

var iStart = 0;
var iEnd = sStr.indexOf(sChar[i]);

while (iEnd != -1)
{
sNewStr += sStr.substring(iStart, iEnd);
iStart = iEnd + 1;
iEnd = sStr.indexOf(sChar[i], iStart);
}
sNewStr += sStr.substring(sStr.lastIndexOf(sChar[i]) + 1, sStr.length);

sStr = sNewStr;
}

return sNewStr;
}
</script>
</head>

<body>
<input type=”text” onkeyup=”javascript:backspacerUP(this,event);” onkeydown=”javascript:backspacerDOWN(this,event);” maxlength=”14″>
</body>
</html>

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s

 
Follow

Get every new post delivered to your Inbox.