# Number filter A column with `editorType: 'number'` gets the **number** filter operator set: `equals`, `notEquals`, `greaterThan`, `lessThan`, **`between`**, `in`, `notIn`, `isBlank`, `isNotBlank`. The default operator is `equals`. > Live demo: Filter - between operator - https://svgrid.com/demos/64-filter-between-operator/ ```ts const columns: GridColumns = [ { field: 'age', header: 'Age', editorType: 'number' }, { field: 'salary', header: 'Salary', editorType: 'number', format: { type: 'currency', currency: 'USD' }, }, ] ``` ## Range - `between` Pick **Between** in the column menu's operator picker and the second input ("To") appears next to the first ("From"). Both endpoints are **inclusive**. Programmatically: ```ts api.setFilter('age', { operator: 'between', value: '18', valueTo: '65' }) ``` Or via the headless filter helper: ```ts import { applyExcelFilter } from '@svgrid/grid' applyExcelFilter(72, { id: 'age', operator: 'between', value: 18, valueTo: 65 }) // → false (72 > 65) ``` The grid treats the filter as inactive when either endpoint is empty. That way the user can type `from = 18` and the grid keeps showing every row until they finish typing the `to` value too. ## Numeric input parsing The filter value comes in from the DOM as a string. Use `parseEditorValue` to convert: ```ts import { parseEditorValue } from '@svgrid/grid' parseEditorValue('number', '4.5') // 4.5 parseEditorValue('number', 'abc') // NaN - reject ``` The grid does this for you when the user types into a header filter. ## Locale Number filters compare raw `Number(cellValue)` against `Number(filter.value)`. They do not parse "1,234.50" or "1 234,50" - feed the column raw numbers, and use a `format` on the column for display. ## Numeric operators A numeric column offers the comparisons rather than the string ones - greater than, less than, between. Nothing configures that; it follows the value type. ```svelte ``` ## Between, from code `between` is the one operator that needs a second bound. Pass `valueTo` alongside `value` - the menu does the same thing when a user picks it. ```svelte api?.setFilter('salary', { operator: 'between', value: '150000', valueTo: '170000' })}> 150k to 170k (api = next)} /> ``` ## See also - [Filter conditions](https://svgrid.com/docs/help/filtering/filter-conditions/) - [Number editor](https://svgrid.com/docs/help/editing/provided-editors/#number-editor) --- SvGrid is the Svelte 5 data grid (`npm install @svgrid/grid`, MIT). This page: https://svgrid.com/docs/help/filtering/number-filter/ . All docs: https://svgrid.com/llms.txt