[data grid] Thousand Separator for Numbers while in edit mode

[capsloq]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

Numbers do get formatted after an edit was made.
However it would be more convenient to get a thousand separator while typing in numbers in edit mode

Examples 🌈

Motivation 🔦

Typing in a Number: 100000. Is it 100.000 or 1.000.000 ? Inline formatting would show the user right away

Order ID 💳 (optional)

No response

[cherniavskii]

Hey @capsloq
You can achieve that by using a third-party library to format an input: https://mui.com/material-ui/react-text-field/#integration-with-3rd-party-input-libraries
Then you can use this input component as a custom edit component: https://mui.com/x/react-data-grid/editing/#create-your-own-edit-component

As for supporting thousand separator out of the box in the Data Grid - there are few issues related:

• thousand separator differs depending on the country https://en.wikipedia.org/wiki/Decimal_separator#Digit_grouping
• we should rather avoid bundling formatting library by default

[capsloq]

Gosh, i thought i read the entire documentation but i must have missed the #create-your-own-edit-component part entirely. This of course provides all the functionality needed. Thank you @cherniavskii

[ghost]

@cherniavskii @capsloq i am able to type the value but it does not show the changed value when i hit enter on the DataGrid cell,the default value is not changing

Updated Value:

Default Value:

i am using the same approach discussed above

[qadir1020]

@cherniavskii @capsloq i am able to type the value but it does not show the changed value when i hit enter on the DataGrid cell,the default value is not changing

Updated Value:

Default Value:

i am using the same approach discussed above

has anyone find out the solution?

[cherniavskii]

@qadir1020 Did you try following the steps in #5381 (comment)?

[qadir1020]

Yes,but the defualt value is not changing,i have shared the screen shot above

[cherniavskii]

@qadir1020 Can you open an issue with a minimal reproduction example so we can investigate?
Thanks!

[qadir1020]

sure