dmathisen dmathisen - 1 year ago 261
Javascript Question

Kendo Grid numbers truncate to 2 decimal places. How to make it respect what the user entered?

In this Kendo Grid demo, if you edit the numbers under "Units in Stock" and add multiple decimals (try 2.203848), it'll truncate it to 2.20. It looks like that's the default behavior.

And I know that we can specify the decimal format with

, for example.

But what if the number of decimals is unknown or can vary? Is there any way to make the grid use the exact number that the user enters?

Answer Source

To make this work in a grid, you need to use a custom editor. Set the number of decimals to a high enough number and make sure your field format has enough places. This great answer here tweaked a bit solves your problem.

function numberEditor(container, options) {
$('<input name="' + options.field + '"/>')
            decimals: 8,
            step    : 0.01

    dataSource: dataSource,
    navigatable: true,
    pageable: true,
    height: 550,
    toolbar: ["create", "save", "cancel"],
    columns: [
        { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: 120 },
        { field: "UnitsInStock", title: "Units In Stock", format: "{0:0.#########}", width: 120, editor: numberEditor },
        { field: "Discontinued", width: 120 },
        { command: "destroy", title: "&nbsp;", width: 150 }],
    editable: true


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download