readOnly/Disable the TextItem part of SpinnerItem

[asmirataharafi]

I'm using SpinnerItem for my page. I need to make the textItem of the spinner as readonly, where user can't input any value and able to click the plus and minus button.
Here's my code,

 
 {name:"good", title: "Good", editorType: "SpinnerItem", writeStackedIcons: false, defaultValue: 0, min: 0, step: 1, canEdit: false}

When I set it to canEdit:false, the whole SpinnerItem is disabled. So how do I make only the TextItem is disabled/readonly?
I've tried the readOnlyTextBoxStyle, both TextItem and plus/minus button is disabled. As it is read-only (canEdit:false) and is using readOnlyDisplay:"static"

And may I know how to use 'unstackedReadOnlyTextBoxStyle' as I saw this on SmartClient reference.

[Isomorphic]

We'd really advise you not to do this, as it can be *extremely* annoying to an end user to be forced to click, say, 50 times when the user could simply type in the value. If you are worried about invalid values, you can just add validation.

But if you absolutely must do this, the simplest approach is probably a change handler that rejects changes that come from keyboard events, or conversely, only allows changes if the increase/decreaseIcons were clicked.

[asmirataharafi]

The client ask for this as they won't need the value up to 50. It's to avoid human error as some of the worker is foreign staff and also there's no keyboard provided, so there's no textItem field needed.

So there's no any way to change the textItem to be read only except creating new formItem?

[Isomorphic]

See previous response. It appears you read the first paragraph, but not the second.

[asmirataharafi]

The previous response show ways to disable any key-press and enable user to change the value by increase/decrease icons.
Is there any ways to disable the textItem part in term of the appearance?

For an example :



This instead of normal looking SpinnerItem where they have textItem+increase/decrease icons.

[Blama]

Hi asmirataharafi,

another option: Did you see the SliderItem here? This does not have a textbox and allows for fast changes. It does take much vertical space, though.

Best regards
Blama

[asmirataharafi]

Hi Blama ,

It's kinda hard for the user to use the SliderItem, they will have a hard time to adjust the quantity as there's up to 53 defect type. They need to click for each defect found (Increment +1), so if I use the SliderItem they might having a hard time to adjust 53 SliderItem.

By the way, thank you for your suggestion.

[Isomorphic]

FormItems are fully stylable, so yes, you can get that appearance if you want. See the many *style properties on FormItem / TextItem.