Doesn't seem to work here - https://stackblitz.com/edit/react-m59yg9?file=app%2Fmain.jsx
I want the input text to be formatted as such: $2.22, but the input allows 3 decimal places and shows no currency symbol. I have added the formatting to the column and to the editCell component, but neither seem to do the trick. If I've done it incorrectly, can you show me the correct way to achieve what the NumericTextBox input here does with its currency example? Thank you!
1 Answer, 1 is accepted
Hello Janki,
After going through the source code I have noticed that the "format" property of the TreeListNumericEditor actually comes from extending the CellProps (which is the same as the column "format" property) and it is applied only to the displayed value and not to the editor.
In order to add the custom format to the editor you can define custom edit cell (https://stackblitz.com/edit/react-jmcl27?file=app%2Fmycustomtexteditor.jsx) or use NumericTextBoxPropsContext (https://www.telerik.com/kendo-react-ui/components/inputs/props-context/)
In the PropsContext example you will notice how the Grid is wrapped in NumericTextBoxPropsContext.Provider and it is used for passing custom properties to all NumericTextBox instances within it.
I will also consult with the developers team to see if we can use the "format" property in the built-in editors as well, because the property is already available in the built-in editors, so it does not make sense to not take advantage of it.
Hope this helps.
Regards,
Konstantin Dikov
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 4
Bronze
Iron
Iron
Thank you so much, Konstantin! I ended up going the route of the ContextProvider since it was cleaner and easier to plug into my existing code, and it works nicely.
Also, thank you for following up with the dev team - I appreciate it! Thanks for a great product!