PrimeFaces Extension Sheet Restrict Decimal Places For Input

Question

I want to restrict decimal places up to 1. User shouldnt type multiple dots(1..99) and (1.99). I want 1.9 2.6 for ex. Not 2.66 then convert into 2.7 etc. I have to use pe:sheetcolumn. I tried to add p:inputnumber and other p: components than pe extension. But pe:sheetcolumn have to be. With below approach it just let user to type multiple dots and multiple decimal places. It just convert to 1 decimal after user entered value on screen with #0.0. But i want to restrict on input to type multiple decimal places than 1 and multiple dots. I thought about javascript keyup event but i think it would be bad approach. How can i achive that

<pe:sheetcolumn headerText="SOME" value="#{SOME.some}" colWidth="200"
                        colType="numeric" numericPattern="#0.0" >
        </pe:sheetcolumn>

For example for p:inputNumber as you can see on image user cant type multiple dots and they cant add decimal places more than 6.

Example

I want to do same thing with pe:sheetColumn. How can i do that

My JSF VERSION : 2.2.1 PRİMEFACES AND PRIMEFACES EXTENSION VERSION : 6.2

Answer 1

If you install this MonkeyPatch you can then tweak the output to do whatever your want. I am pretty sure you can get the current cell with var currentValue = this.getDataAtCell(row , col) If you add this JS to your app you can then tweak how it handles keypresses and validation.

I added this line for you

 var currentValue = this.getDataAtCell(row , col); // VALUE HERE!

So you can validate whatever your want with your code and if there is already a "." don't accept another "." etc.

if (PrimeFaces.widget.ExtSheet) {
    PrimeFaces.widget.ExtSheet.prototype.handleHotBeforeKeyDown = function(e) {
        var selectedLast = this.getSelectedLast();
        if (!selectedLast) {
            return;
        }
        var row = selectedLast[0];
        var col = selectedLast[1];
        var celltype = this.getCellMeta(row, col).type;
        var currentValue = this.getDataAtCell(row , col); // VALUE HERE!

        var evt = e || window.event; // IE support
        var key = evt.charCode || evt.keyCode || 0;
        var shiftDown = e.shiftKey;

        // #740 tab on last cell should focus this next component
        if (this.allowTabOffSheet && key == 9) {
            var lastRow = this.countRows() - 1;
            var lastCol = this.countCols() - 1;
            if ((!shiftDown && row === lastRow && col === lastCol) ||
                (shiftDown && row === 0 && col === 0)) {
                e.stopImmediatePropagation();
                this.unlisten();
                this.deselectCell();

                //add all elements we want to include in our selection
                var focusableElements = 'a:not([disabled]), button:not([disabled]), input[type=text]:not([disabled]):not([hidden]):not([aria-hidden="true"]), [tabindex]:not([disabled]):not([tabindex="-1"]):not([aria-hidden="true"])';
                if (document.activeElement && document.activeElement.form) {
                    var focusable = Array.prototype.filter.call(document.activeElement.form.querySelectorAll(focusableElements),
                        function(element) {
                            //check for visibility while always include the current activeElement
                            return element.offsetWidth > 0 || element.offsetHeight > 0 || element === document.activeElement
                        });
                    var index = focusable.indexOf(document.activeElement);
                    if (index > -1) {
                        var nextElement = focusable[index + 1] || focusable[0];
                        nextElement.focus();
                    }
                }
            }
            return;
        }

        // prevent Alpha chars in numeric sheet cells
        if (celltype === "numeric") {
            // #766 do not block if just CTRL or SHIFT key
            if (key === 16 || key === 17) {
                return;
            }

            // #739 allow navigation
            var ctrlDown = evt.ctrlKey || evt.metaKey; // Mac support
            if (shiftDown || ctrlDown) {
                // navigation keys
                if (key == 9 || (key >= 35 && key <= 40)) {
                    return;
                }
            }

            // check for cut and paste
            var isClipboard = false;
            // Check for Alt+Gr (http://en.wikipedia.org/wiki/AltGr_key)
            if (ctrlDown && evt.altKey) isClipboard = false;
            // Check for ctrl+c, v and x
            else if (ctrlDown && key == 65) isClipboard = true; // a (select all)
            else if (ctrlDown && key == 67) isClipboard = true; // c
            else if (ctrlDown && key == 86) isClipboard = true; // v
            else if (ctrlDown && key == 88) isClipboard = true; // x

            // allow backspace, tab, delete, enter, arrows, numbers and keypad numbers
            // ONLY home, end, F5, F12, minus (-), period (.)
            // console.log('Key: ' + key + ' Shift: ' + e.shiftKey + ' Clipboard: ' + isClipboard);
            var isNumeric = ((key == 8) || (key == 9) || (key == 13) ||
                (key == 46) || (key == 110) || (key == 116) ||
                (key == 123) || (key == 188) || (key == 189) ||
                (key == 190) || ((key >= 35) && (key <= 40)) ||
                ((key >= 48) && (key <= 57)) || ((key >= 96) && (key <= 105)));

            if ((!isNumeric && !isClipboard) || shiftDown) {
                // prevent alpha characters
                e.stopImmediatePropagation();
                e.preventDefault();
            }
        }
    }
}