Search the Community

JavaScript Solution: Format phone number Feature Description: This JavaScript solution shows how to format an entered phone number as (XXX)-XXX-XXXX in a Submission Form. Implementation: This solution can be used "as-is", without any changes if a. It is used in a Submission Form DataPage. b. There is a text field in the table called "Phone". To use this solution copy and paste the code below, inside the HTML Footer section of the Form using the Caspio Bridge DataPage Wizard. <SCRIPT LANGUAGE="JavaScript"> var arrEl = Array.from(document.querySelectorAll('#InsertRecordPhone1, #InsertRecordPhone2, #InsertRecordPhone3')); let regExp = /^[0-9]+$/; arrEl.forEach(function(el) { el.maxLength = 14; el.addEventListener('input', function(v_e) { if (regExp.test(v_e.key)) { this.value = this.value.substr(0, this.value.length - 1); return false; } let v_value = (this.value.replace(/[^\d]/g, '')); console.log(v_value, this.value); if (v_value.length >= 7 && v_value.length < 10) { this.value = (v_value.substring(0, 3) + "-" + v_value.substring(3, 7) + v_value.substring(7, v_value.length)); } else if (v_value.length >= 10) { this.value = ("(" + v_value.substring(0, 3) + ") " + v_value.substring(3, 6) + "-" + v_value.substring(6, 10) +v_value.substring(10, v_value.length)); } }); }); </SCRIPT> Tips for Customization To customize this script to be used on an Update WebForm or a Details page of a Report DataPage, replace the prefix "InsertRecord" with "EditRecord" in the code. And make sure the field is not "Display Only" because this script is used for input fields. Tested Browsers This JavaScript solution was tested on the following platforms and Internet Browsers only. # MS Windows - IE 10, Firefox 23.0.1, Chrome 29.0.1547.57, Safari 5.1.7 # Macintosh # Firefox 3.6.22, Safari 5.1.7 Disclaimer: Use these JavaScript solutions at your own risk! They are provided to assist you in the customization of your programs and while we believe they work properly, by using them you accept all responsibility about them and confirm that they are not a feature of Caspio's platforms and as such are provided "as is" without any warranties, support or guarantees.