Numeric input and display



I need some assistance of how I can create a numeric Editbox, which allows the input of values between a range and show the + or – sign always.

I can’t find something, what is working for 100%. The NumericUpDown, has the buttons to increase/decrease the values, which seems can’t be supressed. (But in my case this is something, what I can not show to the end user)

On the other side the masked textbox doesn’t work either.

What I have to achieve:

Enter values like:

,25 should become +0,25
-1  should become -1,00

and so on

THX for tips

  • You must to post comments
Best Answer

See attached sample. There are 4 NumericUpDown. Two of then use the new appearance key “spinner-showfocus”. It shows the +/- only on focus. You can either create a new appearance in the theme mixin, or modify the original appearance “spinner” to change all spinners in the app.

The mixin sets the maxWidth of the buttons to 0 in the “default” state and resets it in the “focused” state.

You can also change the layout and make the +/- be vertically aligned. Use the Classic-2 theme or add the “buttonsLayout” property to the appearance under “default/properties”:

“properties”: {
“buttonsLayout”: “vertical”

If the buttons are vertical you need to use a smaller icon. It’s all in Classic-2.theme.


  • You must to post comments

I didn’t understand if you want to see the +/- buttons?

  • Harald Bacik
    Wow, so fast I have never ever had an answer! – Very cool The +/- buttons should not be visible. The problem is, that this needs to much space. I need 15 numeric controls side by side. (Please don’t ask why ;) ) THX
  • Harald Bacik
    Or something, what would be cool also, when the +/- buttons only get visible, when the control get’s the focus. This would save a lot of space
  • Frank (ITG)
    Harald, you can achieve this (+/- only while in edit mode) with adding tools to the textbox. Please let me know if you need a sample. Best regards, Frank
  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.