deemuss Posted April 12, 2019 Report Share Posted April 12, 2019 I have found a good solution to format a phone number in JS Format Phone Number article, however this worked only for one field. Is there any way to apply this formatting for multiple fields? Another question: in the search field I have an e-mail field and I need it to be verified before the Search button is pressed. Is it posible? Quote Link to comment Share on other sites More sharing options...
George43 Posted April 12, 2019 Report Share Posted April 12, 2019 You should add this code to the HTML block with Disabled HTML Editor just below search fields. Search field labels should contain Phone and Email parts of words. Example of the app provided below. This soulition is perfectly fit for validating search fields on Search Report Data Page <SCRIPT LANGUAGE="JavaScript"> let validationForm = false; document.addEventListener('DataPageReady', function(event) { const searchInput= 'input[id^=Value]'; document.querySelectorAll(searchInput).forEach(function (element, key, nodelist){ const candidatePhone = "hone"; const candidateEmail = 'mail'; const searchLabelPath = nodelist[key].closest('tr').childNodes[0].childNodes[0].innerHTML; if(searchLabelPath.indexOf(candidatePhone)!=-1){ nodelist[key].maxLength = 14; nodelist[key].placeholder='Type your Phone'; nodelist[key].onkeyup = function(keyUpEvent) { keyUpEvent = keyUpEvent || window.event; const isCharacters=keyUpEvent.keyCode >= 65 && keyUpEvent.keyCode <= 90; const isSpecial=keyUpEvent.keyCode >= 37 && keyUpEvent.keyCode <= 40; if (isCharacters){ this.value = this.value.substr(0, this.value.length - 1); return; } const formattedValue = (this.value.replace(/[^\d]/g, '')); switch(formattedValue.length){ case 7: this.value = (formattedValue.substring(0,3) + "-" + formattedValue.substring(3,7)); break; case 10: this.value = ("(" + formattedValue.substring(0,3) + ") " + formattedValue.substring(3,6) + "-" + formattedValue.substring(6,10)); break; } } } if (searchLabelPath.indexOf(candidateEmail)!=-1){ nodelist[key].maxLength = 25; nodelist[key].placeholder='Type your Email'; document.addEventListener('BeforeFormSubmit', function(event) { if(nodelist[key].value.indexOf('@')==-1){ event.preventDefault(); alert('Please check your Email adress.'); } }); } }) }); </SCRIPT> phone_1_0_2019-Apr-12_0935.zip Quote Link to comment Share on other sites More sharing options...
Kurumi Posted October 22, 2021 Report Share Posted October 22, 2021 Hi! Just an update on this, Caspio has a new Tech Tip called: Format Phone Number in DataPages. You may visit it here: https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/format-phone-number-in-datapages/ Hope it helps! Quote Link to comment Share on other sites More sharing options...
Kurumi Posted July 15, 2022 Report Share Posted July 15, 2022 Hi All - In relation to Caspio's new feature of Worldwide SMS Notifications, if you would like your input phone number fields to be automatically formatted - you can use the International Telephone Input plugin. This JavaScript plugin is used for entering and validating international telephone numbers. It adds a flag dropdown to any input, detects the user's country, displays a relevant placeholder, and provides formatting/validation methods. To know more of the customization, you can check this link: https://github.com/jackocnr/intl-tel-input Here's a sample result in DataPage: After submission in table: Related articles: https://howto.caspio.com/notifications/sms-notifications/configuring-the-sms-enabled-countries/https://howto.caspio.com/release-notes/caspio-32-0/ Hope it helps! Quote Link to comment Share on other sites More sharing options...
PotatoMato Posted October 13, 2022 Report Share Posted October 13, 2022 Just to add, Caspio has released a new howto article regarding this: https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/enhancing-phone-number-fields-with-formatting-and-validation/ Quote Link to comment Share on other sites More sharing options...
futurist Posted November 20, 2023 Report Share Posted November 20, 2023 Just to add, if you also wish to validate value entered in an input field to make sure that it follows this format: www.websitename.com Then you can use this code: <script type="text/javascript"> document.addEventListener('BeforeFormSubmit', function(event) { var inputField = document.querySelector('#InsertRecordNameofField'); const value = inputField.value; const regex = /^www\.[a-zA-Z0-9-]+\.[a-zA-Z]{2,}$/; if (!regex.test(value)) { event.preventDefault(); alert('Invalid Submission!'); } else { document.form["caspioform"].submit(); } }); </script> Make sure to replace "NameofField" with the actual name of the field that you want to validate before submitting. Quote Link to comment Share on other sites More sharing options...
Kurumi Posted September 19 Report Share Posted September 19 Hi! Caspio now offers integration with OpenAI, so you can use extensions to leverage AI to update your data based on a prompt. Here's a sample use case to format phone number fields. Request: Change the format of the phone number of "[@field:Phone_Number]" to (XXX)-XXX-XXXX or US format. Return only the final result. Result: Change the 'Phone_Number' field to your right field name. To learn more about Extensions, you can check it here: https://howto.caspio.com/integration/extensions/ Quote Link to comment Share on other sites More sharing options...
ParkLoey Posted September 30 Report Share Posted September 30 Hello everyone! For those who are interested in using Extensions, it's available for certain plans: https://www.caspio.com/pricing/#:~:text=--,Extensions,-Enhance the functionality But it also can be purchased as an add-on: https://www.caspio.com/add-on-resources/#:~:text=per 10%2C000 calls-,Extensions actions,-%2415 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.