Jump to content

Formatting a numbers field

Recommended Posts


I discovered the following code on how to format a phone number by placing it in the footer section of a data-page. However, I tried to use this code and tweak it to allow formatting for another field in same data-page where I enter a numeric value like 5654-58-8569.  And so, I'm trying to edit this script so I can use if as follows: xxxx-xx-xxxx but can't seem to make it work.

So I have two questions if I may:

  1.  Can I edit the following code to accomplish the above, and ...
  2. Can I use both codes separately in the same footer (one for the phone field, the second for the number field as noted)

Here's the code I found (which works perfectly for the phone field):


var field = 'InsertRecordgpin';

var input = document.querySelector('#' + field);
input.maxLength = 14;
input.onkeyup = telephize
input.onkeydown = telephize

function telephize(v_e) {
// this.value = this.value.replace( /\D+/g, "" ).replace( /([0-9]{1,3})([0-9]{3})([0-9]{4}$)/gi, "($1) $2-$3" ); //mask numbers (xxx) xxx-xxxx

   v_e = v_e || window.event;
    if (v_e.keyCode >= 65 && v_e.keyCode <= 90) {
     this.value = this.value.substr(0, this.value.length - 1);
     return false;
    } else if (v_e.keyCode >= 37 && v_e.keyCode <= 40) {
     return true;
    var v_value = (this.value.replace(/[^\d]/g, ''));
    if (v_value.length == 7) {
     this.value = (v_value.substring(0, 3) + "-" + v_value.substring(3, 7));
    } else if (v_value.length == 10) {
     this.value = ("(" + v_value.substring(0, 3) + ") " + v_value.substring(3, 6) + "-" + v_value.substring(6, 10));

document.addEventListener('BeforeFormSubmit', function(e) {        
       if (input.value.length < 14) {

                       alert('Please input a valid phone number');                        

Link to comment
Share on other sites

Hello @DavidBRX,

I tested the DataPage using the imask.js (https://imask.js.org/)

This code works on my side:

1) Add the CDN to the DataPage Header (disable the HTML editor before pasting the code)

<script src="https://unpkg.com/imask"></script>




2) Add this code to the DataPage Footer


const element = document.getElementById('InsertRecordnumber_field'); // number_field is the field name that should be relalaced with your field name

const maskOptions = {
    mask: '0000-00-0000',
    lazy: false,
    overwrite: 'shift',
    placeholderChar: 'X'

const mask = IMask(element, maskOptions);



In the script:

  • use your field name (in this example the field name is 'number_field' and this is the Submission form, so the field ID is 'InsertRecordnumber_field');
  • mask restricts the input, '0' stands for 'any digit';
  • placeholder character is 'X' in this example.

Please note that the value is submitted with the applied format to the table:

  • Empty field
  • Populated field
  • Submitted into the Table


Link to comment
Share on other sites

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.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...