Search code examples
jsfprimefaceshandsontableprimefaces-extensions

Primefaces extension sheet component on "Enter" press move the focus to the cell in the right


The default operation of the handsontable when press intro is focus the cell on the bottom, but in primefaces extension the focus go to the right, I need go to the bottom, is there some config that I can try?

I tried to modify the afterChange event with the updateSettings method but isn't work.

below the code of the sheet in the JSF way.

<pe:sheet extender="sheetExtender" id="sheet" contextMenu="true"
                    rowHeader="true" colHeader="true" widgetVar="sheetWidget"
                    var="_det" rowKey="#{_det.item}" height="300" showRowHeaders="true"
                    value="#{ordenSuministroController.detalles}"
                    readOnly="#{ordenSuministroController.instance.estado!='PENDIENTE'}"
                    converter="#{ordenSuministroDetConverter}"
                    emptyMessage="No se encontraron registros." locale="es-MX"
                    maxCols="5" minCols="5" movableCols="false" movableRows="true">
                    <f:facet name="header">
                        <strong>HEADER</strong>
                    </f:facet>
                    <pe:sheetcolumn headerText="Descripcion" required="true"
                        readOnly="#{ordenSuministroController.instance.estado!='PENDIENTE'}"
                        value="#{_det.descripcion}" colType="text"></pe:sheetcolumn>
                    <pe:sheetcolumn headerText="Unidad" value="#{_det.unidad}"
                        readOnly="#{ordenSuministroController.instance.estado!='PENDIENTE'}"
                        colType="text"></pe:sheetcolumn>
</pe:sheet>

Primefaces v7.0 Primefaces-extension v7.0.1


Solution

  • Based on HandsonTable documentation you an use the enterMoves function to control how the enter key moves cells. See: https://github.com/handsontable/handsontable/issues/4531

    Then in the Sheet Extender code you can simply do the "extender" functionality like in the Showcase example and change the Extender to:

    function sheetExtender() { 
       this.cfg.enterMoves = {row: 1, col: 0}; 
    }