Flexsheet Phone Formatter

Posted by: curiosichi on 7 May 2019, 12:51 pm EST

  • Posted 7 May 2019, 12:51 pm EST

    I would like the ability to format input from the user as they type, similar to the following:

    https://jsfiddle.net/rafj3md0/

    In this example, I want to limit input to numbers only and format the input to a phone number as the user types in a flexsheet cell, or perhaps regex the input to be a valid email.

    I would like the ability to have different validation types. I intend to store an array of cells I want to format (or have the ability to mark the cell formatter of flexsheet somehow?) to apply my desired validation on a per cell basis.

    for example:

    
            this.validateCells.push({
                validationType: 'Phone',
                sheetIndex: 3,
                columnNumber: '1',
                rowNumber: '2'
            },
            {
                validationType: 'Email',
                sheetIndex: 3,
                columnNumber: '1',
                rowNumber: '3'
            });
    	
    
    

    I understand this is two different steps, one is validating on key up to format the string, the other is doing a addClass(e.cell, ‘wj-state-invalid’) to show invalid email. I wasn’t able to identify a flexsheet handler that could do this however and figured it was worth asking if any of this functionality was built in.

    Thanks.

  • Posted 8 May 2019, 6:39 am EST

    Hi,

    Please refer to the following sample which demonstrates how we could custom formatters for a cell:

    https://stackblitz.com/edit/js-2fc7ex?file=index.js

    ~Sharad

  • Posted 8 May 2019, 8:03 pm EST

    What would be the solution for cells whose data is copied in instead of typed. When copy pasting a phone number, I noticed the formatter was not applied.

    Also, what is the best way to grab the sheet index. I need to limit the formatter to just the sheet index I want (it currently applies to all sheets). In testing, I found e.cell.tabIndex to be -1, and that seemed to be the most obvious property to get the index of the sheet, but I must be choosing the wrong property for this information.

  • Posted 9 May 2019, 2:14 am EST

    Hi,

    The selected sheet index can be get using FlexSheet’s selectedSheetIndex property. The cell value can be formatted on pasting along with entering the value by handling the pastingCell event.

    Please refer to the updated demo sample:

    https://stackblitz.com/edit/js-r1sztk?file=index.js

    Regards,

    Manish Gupta

  • Posted 9 May 2019, 12:09 pm EST

    Does the item formatter not trigger on cells not currently on the visible selected sheet? This question kind of extends into other handlers as well and my observations, but my worksheet functions can alter the value of other cells in different sheets, and since they are not on the selectedSheet’s Index, using that parameter for their handler is not valid for them.

    Is there no reference to the sheet/index the cells is on from the parameters triggering the ItemFormatter (“s” & “e” parameter) to get the index that current cell is from aside from SelectedSheetIndex?

  • Posted 10 May 2019, 5:57 am EST

    Hi,

    The itemFormatter/formatItem gets triggered only for the visible cells as the FlexSheet view is updated the itemFormatter/formatItem gets triggered and format the cells as per code. But it may affect the other sheets if the targeted cell is referenced to another sheets/cells using formulas.

    The formulas/customFunction gets updated if the cells are visible or not.

    but my worksheet functions can alter the value of other cells in different sheets, and since they are not on the selectedSheet’s Index, using that parameter for their handler is not valid for them.

    Could you please elaborate your use-case for this statement?

    As stated previously, the active sheet index can be get using the SelectedSheetIndex property. However, if you would like to access other sheets, you may use the sheets property which returns the Sheet collection.

    You may get the currently selected cell using, selection property.

    If the issue persists, please modify the provided demo sample depicting your issue, so that we may assist you accordingly.

    Regards,

    Manish Gupta

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels