Login | Register   
RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Automate Your Form Validation-5 : Page 5

Write the Formatting Functions
When writing validation scripts, you must keep in mind that you are gathering information from your users. At some point, you will want to save the data to persistent storage so that you can make use of it later. Often, that persistent storage is a database. You can lighten the load on your database by formatting the data before sending it. In this example, I'm simply redisplaying the formatted data in the appropriate fields. After formatting the data and storing it in the form field, it is the formatted data that is passed to the data store, not the user-entered data visible on screen. Include the following code for formatting data:

//Formatting functions function formatPhone(str){ str = strip("*() -./_\n\r\t\\",str); if(str.length==10) return reformat(str,"(",3,") ",3,"-",4); if(str.length==7) return reformat(str,"",3,"-",4); } function formatSSN(str){ str = strip(" -.\n\r\t",str); return reformat(str,"",3,"-",2,"-",4); } function formatZip(str){ str = strip("- \n\r\t",str); if(str.length==5) return str; if(str.length==9) return reformat(str,"",5,"-",4); } function formatCC(str,type){ str = strip("-./_\n\r\t\\",str); switch(type){ case "1": return reformat(str,"",4,"-",4,"-",4,"-",4); break; case "2": return reformat(str,"",4,"-",4,"-",4,"-",4); break; case "3": return reformat(str,"",4,"-",4,"-",4,"-",4); break; case "4": return reformat(str,"",4,"-",6,"-",5); } } function formatDate(str,style){ var dateVar = new Date(str); var year = dateVar.getYear(); if(year<10) year += 2000; if(year<100) year += 1900; switch(style){ case "MM/DD/YY": return (dateVar.getMonth() + 1) + "/" + dateVar.getDate() + "/" + year; break; case "DD/MM/YY": return dateVar.getDate() + "/" + (dateVar.getMonth() + 1) + "/" + year; break; case "Month Day, Year": return getMonthName(dateVar) + " " + dateVar.getDate() + ", " + year; break; case "Day, Month Day, Year": return getDayName(dateVar) + ", " + getMonthName(dateVar) + " " + dateVar.getDate() + ", " + year; break; default: return (dateVar.getMonth() + 1) + "/" + dateVar.getDate() + "/" + year; break; } } //End Formatting Functions

The formatting functions all follow the same pattern: strip out the unnecessary characters and replace the data with data that has been properly formatted through the reformat() function. The only code to take note of is in the formatDate() function where I had to make allowances for dates that are entered as two digits. The workaround first checks for a number less than 10 and, if encountered, adds 2000 to it. It then adds 1900 to any number less than 100. It works now but will not work after 2010—a kludge but it works, for now.

Comment and Contribute






(Maximum characters: 1200). You have 1200 characters left.



Thanks for your registration, follow us on our social networks to keep up-to-date