How to change Kendo Grid Filter Format

Question

I have a field in my grid that are IDs that range from 1 to 2000. I have it designated as a number in the field definition.

The issue is when I use the filter and type in say "1000" when I return to the filter to put in another number it displays "1,000.00". I don't want the filtered text box to show the comma or decimal point. That format isn't relevant for this field.

How do I correct this?

Thanks in advance!

Answer 1

While @Flores answer pointed me in the right direction, it did not do what was expected. At least I still had commas in my filter using his snippet. I ended up making a small modification to the code to achieve the desired result.

filterable: {
    ui: function (element) {
        element.kendoNumericTextBox({
            format: '#',
            decimals: 0,
        });
    },
},

That will give you only numbers. No commas and no decimals.

Answer 2

You can set format on the filterable on the column like this:

                field: "TaskId",
                title: "TaskId",
                width: 80,
                filterable: {
                    ui: function (element) {
                        element.kendoNumericTextBox({
                            format: "n0"
                        });
                    }
                }

Answer 3

You should consider using custom filter menu. Here is how to create DDL. In your case you will need to create numeric textbox with specific format.

Answer 4

Per Kendo support:

If filterable.mode is set to 'row', columns.filterable.cell.template should be used to customize the input. Please refer to this example http://dojo.telerik.com/UKulA/2.

You can limit the range using min and max like in the sample above.