change-decimals-precision-grid.md

title	page_title	description	type	slug	tags	ticketid	res_type	component
Change the Default Decimals Precision of a Numeric Column Filters in the Grid	Change the Decimals Precision of the Numeric Filter - Kendo UI for jQuery Data Grid	Learn how to change the culture default decimals precision in the filter NumericTextBox in the Kendo UI Grid.	how-to	change-decimals-precision-grid	grid, filtering, numbers, decimals	1131251, 1125621	kb	grid

Environment

Product	Progress® Kendo UI® Grid for jQuery
Product Version	Created with the 2017.3.913 version

Description

How can I change the default two decimals places in the numeric filters in a grid column?

Solution

To change the decimals precision:

1. Subscribe for the filterMenuInit event of the Grid.
2. In the filterMenuInit event handler, use setOptions method to set new values for the decimals and format configurations.

<div id="grid"></div>

<script>
    $("#grid").kendoGrid({
        columns: [{
                field: "name"
            },
            {
                field: "age"
            }
        ],
        filterable: true,
        filterMenuInit: function(e) {
            if (e.field == "age") {
                var ntbs = e.container.find("[data-role='numerictextbox']");
                ntbs.each(function(e) {
                    var ntb = $(this).data("kendoNumericTextBox");

                    ntb.setOptions({
                        format: "n3",
                        decimals: 3
                    })
                })
            }
        },
        dataSource: {
            data: [{
                    name: "Jane Doe",
                    age: 30.333
                },
                {
                    name: "John Doe",
                    age: 33.12
                }
            ],
            schema: {
                model: {
                    fields: {
                        age: {
                            type: "number"
                        }
                    }
                }
            }
        }
    });
</script>