Numeric column filter format

4 posts, 0 answers
  1. Chris
    Chris avatar
    3 posts
    Member since:
    Oct 2017

    Posted 14 Nov 2017 Link to this post

    Hi,

    I'm trying to format the filter control for an integer column to not use decimals, separators or spinners. I'm using Kendo.Mvc version 2017.1.118.545.

    Using the answer from another question I've tried the following approach:

    c.Bound(m => m.Id)
      .Title("ID")
      .Filterable(ftb => ftb
        .Cell(cell => cell
          .Operator("eq")
          .ShowOperators(false)
        ).UI("integerFilter"));

     

    function integerFilter(el) {
      el.kendoNumericTextBox({
        spinners: false,
        format: "#",
        decimals: 0
      });
    }

     

    However as per attached screenshot, this doesn't work.

    Please advise how to achieve this behaviour as according to the API guide (and other questions), this is correct.

     

    Thanks,

    Chris

  2.
  3. Preslav
    Admin
    Preslav avatar
    452 posts

    Posted 15 Nov 2017 Link to this post

    Hello Chris,

    To overcome this, use the columns.filterable.cell.template configuration instead of the columns.filterable.ui. More information about this is available in the relevant API Reference:
    Now, The code should look like:

    .Filterable(ftb => ftb
        .Cell(cell => cell
            .Operator("eq")
            .ShowOperators(false)
            .Template("integerFilter")
        ))

    function integerFilter(e) {
        e.element.kendoNumericTextBox({
            spinners: false,
            format: "#",
            decimals: 0
        });
    };

    I hope this helps.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Chris
    Chris avatar
    3 posts
    Member since:
    Oct 2017

    Posted 15 Nov 2017 Link to this post

    Thank you Preslav that's removed the separators, decimals and spinners.

     

    Please could you advise if it's possible to include the clear X button like the regular filter inputs?

  7. Preslav
    Admin
    Preslav avatar
    452 posts

    Posted 17 Nov 2017 Link to this post

    Hi Chris,

    The X button is hidden by default, however, when the user inputs a value, it should appear.

    For example - https://www.screencast.com/t/xhTQ5x64

    If this is not the case on your side, could you please share a runnable project that demonstrates the behavior? This will help me fully understand the case and I will be able to provide further assistance.


    Regards,
    Preslav
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  8.
Back to Top