PFE Sheet how to prevent resize with frozen columns in PF7

Question

I have been working with primefaces, and the sheet component meet most of the requirements that I need to accomplish my work, did some research and added contextual menu and other functions, but my main problem is visual, if I put some columns fixed, and I move to the right all the rows are resized automatically, I have decided to avoid the fixed columns but anyway if I move the cursor a few columns to the right the row's height is resized.

This is my code: (many words in spanish because it is my first language)

Some of the custom things i added

 <ui:define name="head">

        <script type="text/javascript">

            var $settings = {
                contextMenu: {
                    callback: function (key, options) {
                        if (key === 'borrar') {
                            eliminar();
                        } else if (key === 'editar') {
                            setTimeout(function () {
                                verDetalleProducto();
                            }, 100);
                        }
                    },
                    items: {
                        "borrar": {name: 'Eliminar linea'},
                        "editar": {name: 'Ver Detalles Adicionales'}
                    }
                }
            };

            function sheetExtender() {
                // this = widget
                // this.cfg = JSON configuration
                this.cfg.trimWhitespace = true;


                $(document).ready(function () {


                    var $hot = PF('sheetWidget1').ht;
                    console.log($hot);
                    $hot.updateSettings($settings);
                });

            }
            ;

            function sheetExtender2() {
                // this = widget
                // this.cfg = JSON configuration
                this.cfg.trimWhitespace = true;


                $(document).ready(function () {

                    var $hot2 = PF('sheetWidget2').ht;
                    console.log($hot2);
                    $hot2.updateSettings($settings);

                });

            }
            ;
        </script>

    </ui:define>   

This is my table:

<pe:sheet id="sheet1" 
          widgetVar="sheetWidget1" 
          value="#{sheetController.productosExcel}" 
          var="row"    
          
          rowKey="#{row}"
          showRowHeaders="true"
          resizableCols="true"                                                   
          resizableRows="false"
          readOnly="false"                                                 
          height="#{(sheetController.productosExcel.size() le 5) ?  (75 + sheetController.productosExcel.size() *50) : 75 + 5 * 50}"
          rowStyleClass="#{ row.cantidad gt 0 and row.precioUnitario gt 0 ? 'correcto' : 'incorrecto'  }"                                              
          extender="sheetExtender"                              
          >

    <f:facet name="header">
        <h:outputText style="color: white;" value="Productos Agregados"/>
    </f:facet>

    <p:ajax event="change" update="tabs:sheet1 :form:growl" listener="#{sheetController.cellChangeEvent}"/>
    <p:ajax event="rowSelect" update=":form:growl" listener="#{sheetController.rowSelectEvent}"/>
    <p:ajax event="cellSelect" update=":form:growl" listener="#{sheetController.rowSelectEvent}"/>

    <pe:sheetcolumn headerText="Código Insumo"
                    readOnly="true"          
                    colType="numeric"
                    value="#{row.idProducto}"                                                           
                    colWidth="100"
                    numericPattern="00000000"
                    >
    </pe:sheetcolumn>



    <pe:sheetcolumn headerText="Renglón"                                                
                    readOnly="true"          
                    colType="numeric"                                                
                    value="#{row.idRenglon}"                                                                                                                                                                 
                    colWidth="80">
    </pe:sheetcolumn>

    <pe:sheetcolumn headerText="Insumo"                                                
                    readOnly="true"          
                    colType="text"                                                
                    value="#{row.nombre}"                                                                                                                                                                
                    colWidth="80">
    </pe:sheetcolumn>

    <pe:sheetcolumn headerText="Presentacion"                                                
                    readOnly="true"          
                    colType="text"                                                
                    value="#{row.presentacion}"                                                                                                                                                                
                    colWidth="120">
    </pe:sheetcolumn>                                        


    <pe:sheetcolumn headerText="Comentario"
                    readOnly="false"
                    colType="text"
                    value="#{row.comentario}"                                              
                    colWidth="250"/>                                       

    <pe:sheetcolumn headerText="Cantidad Enero"
                    readOnly="false"                                                               
                    colType="numeric"
                    value="#{row.enero}"    
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Cantidad Febrero"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.febrero}"    
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Cantidad Marzo"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.marzo}"    
                    colWidth="150"/>


    <pe:sheetcolumn headerText="Cantidad Abril"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.abril}"    
                    colWidth="150"/>


    <pe:sheetcolumn headerText="Cantidad Mayo"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.mayo}"    
                    colWidth="150"/>


    <pe:sheetcolumn headerText="Cantidad Junio"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.junio}"    
                    colWidth="150"/>


    <pe:sheetcolumn headerText="Cantidad Julio"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.julio}"    
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Cantidad Agosto"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.agosto}"    
                    colWidth="150"/>




    <pe:sheetcolumn headerText="Cantidad Septiembre"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.septiembre}"    
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Cantidad Octubre"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.octubre}"    
                    colWidth="150"/>


    <pe:sheetcolumn headerText="Cantidad Noviembre"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.noviembre}"    
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Cantidad Diciembre"
                    readOnly="false"          
                    colType="numeric"
                    value="#{row.diciembre}"    
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Cantidad Anual"
                    readOnly="true"
                    colType="numeric"
                    numericPattern="0.00"
                    value="#{row.cantidad}"                                              
                    colWidth="150"/>


    <pe:sheetcolumn headerText="Costo Unitario"
                    readOnly="false"
                    colType="numeric"
                    numericPattern="0,0.00"
                    value="#{row.precioUnitario}"                                              
                    colWidth="150"/>

    <pe:sheetcolumn headerText="Total"
                    readOnly="true"
                    colType="numeric"
                    numericLocale="es-GT"
                    numericPattern="0,0.00"
                    value="#{row.precioUnitario * row.cantidad}"                                              
                    colWidth="150"/>

</pe:sheet>

normal size

after a few columns to the right:

other size

Faces version: 2.1.17

EDIT: Primefaces 6.2 as pnd primefaces extension 6.2.11

It is very similar to the next question but it has no responses

Primefaces Sheet How to Remove Row Resize Functionality

I tried with some css stuff but it did not work, sorry for bother you users, greetings.

EDIT: Primefaces 6.2 as pnd primefaces extension 6.2.11

Answer 1

I would like to post a partial solution for this issue, after a break and analyzing the js code from the sheet primeface extension found the property that can help, in my case just needed to overwrite the 'rowHeights' key into the setting variable.

The key 'rowHeights' is called by the hook 'modifyRowHeight' defined in the js file for this extension, so doing this we can avoid the 'resize' if we can find a value that fits the most of our values, maintaining the same height for all the rows.

var $settings = {
            rowHeights: 80, //<--- this is the value to overwrite
            contextMenu: {
                callback: function (key, options) {
                    if (key === 'borrar') {
                        eliminar();
                    } else if (key === 'editar') {
                        setTimeout(function () {
                            verDetalleProducto();
                        }, 100);
                    }
                },
                items: {
                    "borrar": {name: 'Eliminar linea'},
                    "editar": {name: 'Ver Detalles Adicionales'}
                }
            }
        };

function sheetExtender() { //Defining the sheetExtender function

           
            this.cfg.trimWhitespace = true;                
            
            $(document).ready(function () {                    
                var $hot = PF('sheetWidget1').ht;
                $hot.updateSettings($settings);
            });
            
        }

Thanks for your help.