CODEWITHSUNDEEP
kendo-uitelerikkendo-gridstring-formattingnumber-formatting
RandomUser
RandomUser

Reputation: 1853

Kendo grid number formatting as percentage issue

I am displaying numeric value formatted as percentage using the following:

columns.push(
            {
                field: key,
                hidden: false,
                format: "{0:p2}"
            });

When the field is supposed to display 1.00% it's displaying 100.00% like wise any given value it's adding zeros, one more value is 65.37% and output is 6,537.00%

Any settings that I am missing or anything wrong with the format? The problem is I am creating grid dynamically and hence I can't show the full grid setup.

In the above you can see I am pushing columns which is an array which will be passed to the function which creates grid.

Upvotes: 3

Views: 11696

Answers (4)

Jean-François Beaulieu
Jean-François Beaulieu

Reputation: 4445

For decimal exactitude:

format="##.0000 \%"

Upvotes: 0

Judd
Judd

Reputation: 33

Telerik Kendo UI for Angular: above did not work for me. Kept converting 80% to 800%

This worked:

format="#=Percentage# \%"

Upvotes: 0

Jayesh Goyani
Jayesh Goyani

Reputation: 11154

Please try with the below code snippet.

<div id="grid"></div>
<script>
    $("#grid").kendoGrid({
        dataSource: {
            data: [
              { id: 1, increase: 1.00 },
              { id: 1, increase: 65.37 }
            ],
            schema: {
                model: {
                    id: "id",
                    fields: {
                        increase: { type: "number" }
                    }
                }
            }
        },
        columns: [
          { field: "id" },
          {
              field: "increase",
              template: '#=kendo.format("{0:p}", increase / 100)#'
          }
        ]
    });

</script>

Let me know if any concern.

Upvotes: 8

layonez
layonez

Reputation: 1785

When you format value as percentage there is not build in mechanizm in kendo to multiply it. This can only be done by multiplying and dividing the value. Here some example

If you want just display value with percent symbol you need to use template: template: "<span>#=fieldName# %<\span>"

Upvotes: 1

Related Questions