Filter column on numeric with more than 2 decimals

8 posts, 1 answers
  1. Brian
    Brian avatar
    16 posts
    Member since:
    Nov 2012

    Posted 08 Feb 2013 Link to this post

    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.
  2. Answer
    Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 12 Feb 2013 Link to this post

    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.

    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Brian
    Brian avatar
    16 posts
    Member since:
    Nov 2012

    Posted 12 Feb 2013 Link to this post

    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.
  5. Natalia
    Natalia avatar
    6 posts
    Member since:
    Dec 2012

    Posted 07 Mar 2013 Link to this post

    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
  6. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 11 Mar 2013 Link to this post

    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. Piyush Bhatt
    Piyush Bhatt avatar
    17 posts
    Member since:
    Oct 2014

    Posted 17 Feb 2015 Link to this post

    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?
  8. Piyush Bhatt
    Piyush Bhatt avatar
    17 posts
    Member since:
    Oct 2014

    Posted 17 Feb 2015 in reply to Piyush Bhatt Link to this post

    OR rather how can we find out the 'Column' Index or 'Column' object from the filter Element that is passed to this function?
  9. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2566 posts

    Posted 19 Feb 2015 Link to this post

    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
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready