RadioGroupButton deselect value when button clicked!!!

Flow
1

Hi guys, I’ve been working on an online exam project and currently adding some multiple choice feature. My problem is, each time I moved to the next question the value from the previous radiogroupbutton is removed/deselect. But still the assigned value of the object is present.

public class TestQuestionaire extends Dialog {

    TQCoverageService tqcs = new TQCoverageServiceImpl();
    CellItemService cis = new CellItemServiceImpl();
    ItemKeyService iks = new ItemKeyServiceImpl();
    
    VerticalLayout mainLayout;
    TQCoverage tqCoverage;
    List<CellItem> ciList = new ArrayList();
    Map<CellItem, CellItemOption> cellItemAnswerMap = new HashMap();
    CellItem cellItem;
    Binder<CellItem> binder;
    
    private int tqCoverageId;
    private int cellItemIndex = 0;
    private int cellItemIndexSize = 0;
    private int score = 0;
    
    Button next;
    Button prev;
    String stem;
    Paragraph stemHolder;
    RadioButtonGroup<CellItemOption> cioGroup;
    
    public TestQuestionaire(int tqCoverageId) {
        this.tqCoverageId = tqCoverageId;
        
        tqCoverage = tqcs.findTQCoverage(tqCoverageId);
        cellItemIndexSize = tqCoverage.getTotalItems();
        
        for(TQItems tqi : tqcs.findAllTQItems(tqCoverageId)){
            cellItem = cis.findCellItem(tqi.getCellItemId());
            
            List<CellItemOption> cioList = cis.findAllItemOptions(tqi.getCellItemId());
            cellItem.setCellItemOptionList(cioList);
            
            ItemKey ik = iks.findItemKey(tqi.getItemKeyId());
            cellItem.setItemKey(ik);
            
            TQAnswerKey tqak = tqcs.findTQAnswerKeyByTQItem(tqi.getTqItemId());
            cellItem.setTQAnswerKey(tqak);
            
            cellItemAnswerMap.put(cellItem, new CellItemOption());
            
            ciList.add(cellItem);
        }
        
        stemHolder = new Paragraph();
        stemHolder.setWidthFull();
        stemHolder.getStyle().set("font-weight", "500");
        
        Hr hr = new Hr();
        hr.setWidthFull();
        
        cioGroup = new RadioButtonGroup<>();
        cioGroup.setRenderer(new TextRenderer<>(CellItemOption::getCellItemOption));
        cioGroup.addThemeVariants(RadioGroupVariant.LUMO_VERTICAL);
        cioGroup.addValueChangeListener(event -> {
            if(event.getValue() == null){
                return;
            }
            
            if(!event.getValue().equals(event.getOldValue())){
                cellItemAnswerMap.replace(getCellItem(), event.getValue());
            }
        });
        
        mainLayout = new VerticalLayout(stemHolder, hr, cioGroup);
        mainLayout.setWidth("600px");
        
        hr = new Hr();
        hr.setWidthFull();
        mainLayout.add(hr);
                
        binder = new Binder();
        binder.forField(cioGroup)
                .bind(CellItem::getCellItemOption, CellItem::setCellItemOption);
        changeCellItem();
        
        prev = new Button(VaadinIcon.BACKWARDS.create());
        prev.addClickListener(event -> {
            cellItemIndex--;
            if(cellItemIndex == 0){
                prev.setEnabled(false);
                next.setEnabled(true);
            } else {
                prev.setEnabled(true);
                next.setEnabled(true);
            }
            
            changeCellItem();
        });
        prev.setEnabled(false);
        
        next = new Button(VaadinIcon.FORWARD.create());
        next.getStyle().set("margin-left", "490px");
        next.addClickListener(event -> {
            cellItemIndex++;
            if((cellItemIndex + 1) == cellItemIndexSize){
                next.setEnabled(false);
                prev.setEnabled(true);
            } else {            
                next.setEnabled(true);
                prev.setEnabled(true);
            }
            
            changeCellItem();
        });
        
        //this button is only to test if the current value for radiobuttongroup is removed/deselect when clicked!!
        mainLayout.add(new Button("TEST", event -> {
            changeCellItem();
        }));
        
        HorizontalLayout buttons = new HorizontalLayout(prev, next);
        buttons.setWidthFull();
        buttons.setJustifyContentMode(FlexComponent.JustifyContentMode.START);
        mainLayout.add(buttons); 
        
        add(mainLayout);
        open();
    }

    //refresh components for new/previous set of item
    private void changeCellItem(){
        stemHolder.removeAll();
        cellItem = ciList.get(getCellItemIndex());
        stem = cellItem.getItem().replace("{key}", cellItem.getItemKey().getItemKey());
        stemHolder.add(stem);
        
        cioGroup.clear();
        cioGroup.setItems(cellItem.getCellItemOptionList());
        cellItem.setCellItemOption(cellItemAnswerMap.get(cellItem));
        
        binder.readBean(cellItem);
        binder.setBean(cellItem);
        
        for(CellItemOption cio : cellItem.getCellItemOptionList()){
            System.out.println("option: "+cio.getCellItemOption());
        }
        System.out.println("selected: "+cellItemAnswerMap.get(cellItem).getCellItemOption());
    }
    
    public TQCoverage getTQCoverage() {
        return tqCoverage;
    }

    public CellItem getCellItem() {
        return cellItem;
    }

    public int getCellItemIndex() {
        return cellItemIndex;
    }

    public int getCellItemIndexSize() {
        return cellItemIndexSize;
    }
    
    //for testing purposes only
    public static CellItem getKey(Map<CellItem, CellItemOption> mapref, CellItemOption cio) {
        CellItem ci = null;
        for (Map.Entry<CellItem, CellItemOption> map : mapref.entrySet()) {
            if (map.getValue().equals(cio)) {
                ci = map.getKey();
            }
        }
        return ci;
    }
}
2

I didn’t read through the whole code, but this part

cioGroup.clear();
cioGroup.setItems(cellItem.getCellItemOptionList());
cellItem.setCellItemOption(cellItemAnswerMap.get(cellItem));

looks like you reset all the items, without actually calling cioGroup.setValue() again afterwards, could you try cioGroup.setValue(cellItem.getCellItemOption()); directly after and see if that fixes things?

Edit: oh the cioGroup is bound with a Binder, I overlooked that. To update all bound fields to the current values of the bound bean, you can call binder.readBean(binder.getBean()). Edit2: No, you did that too. At this point I just feel silly. Sorry for being no help.

3

It’s ok bro… :slight_smile: