Filter column on numeric with more than 2 decimals

[Brian]

So I've looked at the demos for implementing custom filters. I have a field which is numeric where the amount of significant decimals can be taken out to 5. When trying to filter on those fields to five decimal places of significance, the filter window truncates that to 2 decimal digits and rounds it. I know this is well known behavior, so I decided to do the same thing with the filterable ui parameter as I did in my editor for that column and create a kendoNumericTextBox. It seems to not be working however and still truncates down to 2 decimal places.


I've made a JSFiddle for this: JSFiddle

Steps to reproduce:
1. Filter on Override Mono Cost field
2. Set first parameter to "Is Equal To"
3. In the numeric field enter "0.74505"
4. Then click Filter/hit enter
5. Pulling back open the same filter shows the value rounded to "0.75" with no results.

I'm not sure if I've configured it wrong, but I followed it based on the example on the demo page.

[Alexander Valchev]

Hello Brian,

columns.filterable.ui option was added in the service pack release (v2012.3.1315). You example uses v2012.3.1114, I updated resources and got everything to work as expected.

• http://jsfiddle.net/valchev/5EHqL/4/

In order to avoid the rounding, you should also set format to "n5".

{
    field: "OverrideMonoCPP",
    title: "Override Mono Cost",
    editor: extendedDecimalNumeric,
    width: "110px",
    filterable: {
        ui: function (element) {
            element.kendoNumericTextBox({
                format: "n5",
                decimals: 5
            });
        }
    }
}

I hope this will help.

Regards,
Alexander Valchev
the Telerik team

[Brian]

Yep, that did it. Sadly this isn't the first time I've run into this problem. It'd be nice to have in the documentation what release features came out in but regardless, thanks for the help.

[Natalia]

Hi,

May I know how I can do that with the MVC wrapper? Let me know if you want me to re-post this in the MVC forum. Thanks.

Regards,

Natalia

[Alexander Valchev]

Hello Natalia,

The syntax is similar - you have to set custom filter function through the ColumnFilderableBuilder.

.Filterable(filterable => filterable.UI("customNumericFilter"))

function customNumericFilter (element) {
    element.kendoNumericTextBox({
        format: "n5",
        decimals: 5
    });
}

For more information please check the corresponding demo.

Kind regards,
Alexander Valchev
the Telerik team

[Piyush Bhatt]

while the filterable - ui approach works, its still not the elegant solution.

If we have multiple numeric columns - one with 2 decimal points, 3 dec point and 5 decimal points - above approach would require to create 3 different functions. How  can we create one function with a parameter for format and decimal so when we configure the column we can pass those parameters?

[Piyush Bhatt]

OR rather how can we find out the 'Column' Index or 'Column' object from the filter Element that is passed to this function?

[Kiril Nikolov]

Hello Piyush,

You can still call one function and pass the column name as arguments via closure. It will be like this:

columns.Bound(p => p.UnitPrice).Width(140).Filterable(filterable=>filterable.UI("function(element) {myFilter(element, 'UnitPrice')}"));

and then

<script>
   function myFilter(element, arguments) {
        //argument will hold 'UnitPrice' in this case
       //element will be the input
    }
</script>

Regards,
Kiril Nikolov
Telerik