OptionGroup and caption

I have an OptionGroup component that have two values, Pre and Post. I want those two values to be passed to the backend. But on the form, I want to display more info to describe what Pre and Post mean to the users.

For example, for Pre, on the form I want to display the description “Pre School” and for Post, I want to display “Post School”. When users select “Pre School”, I want to pass the value “Pre” to the backend.

Can I do that with OptionGroup? If so, how please?


When you select something in an OptionGroup, the value is the selected item’s
item ID
. By default, the captions shown in the OptionGroup are also the item id, but you can override this default behavior by using the setItemCaptionPropertyId() method. Another user had exactly the same problem (but with NativeSelect),
here’s the thread
containing a code example that show you how to solve the problem.