We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Column setting for rounding number in 2 decimal points.

Thread ID:

Created:

Updated:

Platform:

Replies:

144383 May 3,2019 12:24 PM UTC Jul 18,2019 09:32 AM UTC Angular - EJ 2 5
loading
Tags: Grid
Neo
Asked On May 3, 2019 12:24 PM UTC

Hi All,

I want to add a column setting for rounding number in 2 decimal points. How we can handle in a proper way? I tried to code as below,

field: 'gas', editType: 'numericedit', editParamsdecimalPlaces: 2 }, format: "{0:n2}", validationRulesrequired: true, min: 10, max: 10000 }, width: 80 },

OR 

field: 'gas', edit: params: {decimals: 2, format: 'N' } },

Those codes didn't work for me.


Note: I'm using Batch Edit mode, Column settings are loaded from [columns] property (Not in the html)

Thank you.


Hariharan J V [Syncfusion]
Replied On May 8, 2019 12:34 PM UTC

Hi Neo,

Greeting from Syncfusion.

We have prepared a simple to achieve your requirement("set decimal places to numeric texbox in grid batch edit") and please refer the below code snippets and sample.

[app.component.html]
<e-column field='Freight' headerText='Freight' [edit]='numEditParams' width='120' format='C3' textAlign='Right' editType='numericedit' [validationRules]='freightrules'></e-column>
[app.component.ts]
this.numEditParams = { params: {decimals: 3, format: 'n'}};

Sample: https://stackblitz.com/edit/angular-yjegvk-u8kqlc?file=app.component.ts

Regards,
Hariharan

Neo
Replied On May 9, 2019 10:52 AM UTC

Hi Neo,

Greeting from Syncfusion.

We have prepared a simple to achieve your requirement("set decimal places to numeric texbox in grid batch edit") and please refer the below code snippets and sample.

[app.component.html]
<e-column field='Freight' headerText='Freight' [edit]='numEditParams' width='120' format='C3' textAlign='Right' editType='numericedit' [validationRules]='freightrules'></e-column>
[app.component.ts]
this.numEditParams = { params: {decimals: 3, format: 'n'}};

Sample:
https://stackblitz.com/edit/angular-yjegvk-u8kqlc?file=app.component.ts

Regards,
Hariharan


Hi Hariharan,
My requirement was achieved. I have other queries to ask,

1. How to hide up & down arrows when use of 'numericedit' type.
2. Display always 2 decimal points without thousand separates. (Roundingwith 2 decimal points , Type: numbereditType:'stringedit')
3.Display always 2 decimal points without thousand separates.(Roundingwith 2 decimal points,Type: stringeditType:'stringedit', Some time data load as text. This formatting should happen if found numeric value)

Thank you.


Hariharan J V [Syncfusion]
Replied On May 15, 2019 08:51 AM UTC

Hi Neo,

We are sorry for the delay.

Query 1:

We suggest you to use `showSpinButton` property to achieve your requirement. Please refer the below code snippets.

this.numEditParams ={ params:{decimals:3, format:'n', showSpinButton: false}};

Query 2 & 3:

We suggest you to use grid cell edit template feature to acheive your requirement. Please refer the below sample and documentation link.

Sample: https://stackblitz.com/edit/angular-yjegvk-oyq4xj?file=app.component.ts
Documentation: https://ej2.syncfusion.com/angular/documentation/grid/edit/?no-cache=1#cell-edit-template

Regards,
Hariharan

Neo
Replied On July 17, 2019 08:50 AM UTC

Hi,

My requirement has been achieved. Thank you for the support.

Hariharan J V [Syncfusion]
Replied On July 18, 2019 09:32 AM UTC

Hi Neo,

Thanks for your update.

We are happy to hear that your requirement has been achieved.

Regards,
Hariharan

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon