Results 1 to 2 of 2

Thread: Ext grid column numeric filter - how to configure?

  1. #1
    Sencha User
    Join Date
    Mar 2009
    Location
    Berlin, DE
    Posts
    12
    Answers
    1

    Default Answered: Ext grid column numeric filter - how to configure?

    Hello.

    Within our project we commonly set header (menu) filter for grid column like this:

    Code:
    //...
        initComponent: function() {
        //...
    
        this.columns = [
            //...
            {
                header: Lang.translate('some_number_column'),
                    flex: .7,
                    sortable: true,
                    dataIndex: 'some_number_column',
                    renderer: function(value) {
                        return (value == 0 || value == 1)
                            ? value
                            : Ext.util.Format.number(value, '0.#####');
                    },
                    filter: {
                        type: 'numeric'
                    }
            },
            //...
        ];
    
        //...
        }
    //...
    }
    The problem is I do not know how to be able to configure the `numeric` filter for that column. It is always displaying the options greater/less than and equal to - but I am only able to put there values with maximum of 2 decimal places. All the values with more decimal places I enter there got rounded to only two decimal places, e.g. if I enter there 0.1275 the gets rounded to 0.13.

    This is really a problem as I am not then able to filter for all the entries that's value in this column is equal to e.g. 0.156.

    All the values in the column are between 0 and 1 only.

    I walked through the docs, ofc, but didn't find any relevant configuration options for NumericFilter.

    Many thanks for any help!

  2. I was missing the information, that for Ext.ux.grid.filter.NumericFilter You could set the same config options as for Ext.ux.grid.menu.RangeMenu.

    After realizing this I tried to set the fieldCfg options which didn't work because there are 3 fields at all (greather than, less than and equal to), therefore I ended up with this solution:

    Code:
    //... 
    initComponent: function() {     
        var numberFilterConfig {
            minValue: 0,
            maxValue: 1,
            step: 0.01,
            decimalPrecision: 3
        },
    
        //...      
    
        this.columns = [         
            //...         
            {             
                header: Lang.translate('some_number_column'),                 
                flex: .7, 
                                sortable: true,                 
                dataIndex: 'some_number_column',                 
                renderer: function(value) {                     
                    return (value == 0 || value == 1)                         
                        ? value 
                                               : Ext.util.Format.number(value, '0.#####');                 },                 
                filter: { 
                    type: 'numeric',
                    fields: {
                        gt: numericFilterConfig,
                        lt: numericFilterConfig,
                        eq: numericFilterConfig
                    }
                }
            },         
            //...     
        ];
    
        //...     
    }

  3. #2
    Sencha User
    Join Date
    Mar 2009
    Location
    Berlin, DE
    Posts
    12
    Answers
    1

    Default Solution found.

    I was missing the information, that for Ext.ux.grid.filter.NumericFilter You could set the same config options as for Ext.ux.grid.menu.RangeMenu.

    After realizing this I tried to set the fieldCfg options which didn't work because there are 3 fields at all (greather than, less than and equal to), therefore I ended up with this solution:

    Code:
    //... 
    initComponent: function() {     
        var numberFilterConfig {
            minValue: 0,
            maxValue: 1,
            step: 0.01,
            decimalPrecision: 3
        },
    
        //...      
    
        this.columns = [         
            //...         
            {             
                header: Lang.translate('some_number_column'),                 
                flex: .7, 
                                sortable: true,                 
                dataIndex: 'some_number_column',                 
                renderer: function(value) {                     
                    return (value == 0 || value == 1)                         
                        ? value 
                                               : Ext.util.Format.number(value, '0.#####');                 },                 
                filter: { 
                    type: 'numeric',
                    fields: {
                        gt: numericFilterConfig,
                        lt: numericFilterConfig,
                        eq: numericFilterConfig
                    }
                }
            },         
            //...     
        ];
    
        //...     
    }

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •