.getValue RadioButtonGroup via template returns null

General
1

Hi Everyone,

I have a radiogroup in my template, it contains two radiobuttons. But when I want to retrieve the selected radiobutton via .getValue() I just get a null. I thought that this approach is the one I need to do, 'cause for a checkbox it’s working fine.
I use Vaadin 14.1.0 right now.

Best regards
-Jan-

Template:

<vaadin-radio-group theme="vertical" name="laufzeit" id="rbgLaufzeit">        
<vaadin-radio-button value="unbefristet">Unbefristet
<div>
<vaadin-date-picker style="width: 150px" id="dtpUnbefristetAb"></vaadin-date-picker></div></vaadin-radio-button>                            
<vaadin-radio-button value="befristet">Befristet
<div>
<vaadin-horizontal-layout theme="">
<vaadin-date-picker style="width: 150px" id="dtpBefristetAb"></vaadin-date-picker>
<label style="margin-left: 15px; margin-right: 15px;">-</label>
<vaadin-date-picker style="width: 150px" id="dtpBefristetBis"></vaadin-date-picker>
</vaadin-horizontal-layout>                 
<vaadin-text-field label="Grund" style="width: 340px;" id="befristetGrund"></vaadin-text-field>                 
</div></vaadin-radio-button>
</vaadin-radio-group>

I wired said piece with

@Id("rbgLaufzeit")
private RadioButtonGroup<String> rbgLaufzeit;

Sofar so good, I added a button with a clickevent and wanted to see the selected radiobutton:

private void btnPreview(ClickEvent<Button> buttonClickEvent) {
log.debug("btnPtreviews for Employee " + name.getValue());
log.debug("rgbValue " + rbgLaufzeit.getValue());
}
2

If you set the options / values of a field in the template, those are not automatically sent to server. Good example is that if you add vaadin-combo-box in your template and set options to it, you can add value change listener in the server side after linking the combo with @Id annotation, but the value will be null, since options are not synced. This is intentional design decision. It would be too costly to blindly sync the options in all cases.

So you should select of these two ways of operation

  1. If source data to populate options of selection component is from the server, then just add slot to template and populate that with component using Java API server side

  2. If the options data is static and not needed in server side, i.e. it is purely client side logic. Then you can set the options in template and used it local JavaScript logic of the template as you wish.

3

Thanks for the answer! Sounds logical.