Question

I’m making a form where a teacher creates questions. One type of question is a multiple choice question. The form has a textArea where you write the question formulation and a listView with textFields for the alternatives.

There is a button to add a new alternative (add a new textField), and when pressed it repaints all the alternatives and adds a new one. Now here’s the problem: I want the textfields already in the listView with text in them to keep text written by the teacher after the repaint, but I have no idea how to make this possible (except for saving the values to the database before every repaint, but that seem like a bad idea).

Here’s the code for my MultipleChoiceQuestionPanel, I hope it will be sufficient.

public class MultiChoiceQuestionPanel extends QuestionPanel {

    private List<Alternative> alternatives;

    @SpringBean
    private AlternativeRepository alternativeRepository;

    public List<Alternative> getAlternatives(){
        return alternatives;
    }

    public MultiChoiceQuestionPanel(String id, MultipleChoiceQuestion q){
        super(id, q);

        final WebMarkupContainer parent = new WebMarkupContainer("alternativesContainer");
        parent.setOutputMarkupId(true);
        add(parent);
        parent.add(new Label("AnswerLabel", "Svar"));

        q.setAlternatives(alternativeRepository.findByMultipleChoiceQuestion(q));
        alternatives = q.getAlternatives();
        Form form = new Form("addForm");
        form.add(new ListView<Alternative>("alternatives", alternatives) {
            @Override
            protected void populateItem(final ListItem<Alternative> alternativeListItem) {
                alternativeListItem.add((TextField<String>) new TextField<String>("alternative", new AlternativeModel(alternativeListItem.getModelObject())).setRequired(true).setType(String.class));
                Form form = new Form("removeForm");
                form.add(new AjaxSubmitLink("remove") {
                    @Override
                    protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
                        Alternative selected = alternativeListItem.getModelObject();
                        alternativeRepository.delete(selected);
                        getAlternatives().remove(selected);
                        target.addComponent(parent);
                    }
                });
                alternativeListItem.add(form);
                add(alternativeListItem);
            }
        });

        AjaxSubmitLink a = new AjaxSubmitLink("add") {
            @Override
            protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
                Alternative alternative = new Alternative();
                MultipleChoiceQuestion mcq = (MultipleChoiceQuestion) getQuestion();
                alternative.setSequenceNumber(mcq.getAlternatives().size());
                alternative.setMultipleChoiceQuestion((MultipleChoiceQuestion) getQuestion());
                alternativeRepository.save(alternative);
                getAlternatives().add(alternative);
                target.addComponent(parent);
            }
        };
        a.setDefaultFormProcessing(false);
        form.add(a);
        parent.add(form);
    }
}

Any help appreciated.

Answer 1

From the Javadoc of ListView:

WARNING: though you can nest ListViews within Forms, you HAVE to set
the setReuseItems property to true in order to have validation work
properly. By default, setReuseItems is false, which has the effect
that ListView replaces all child components by new instances. The idea
behind this is that you always render the fresh data, and as people
usually use ListViews for displaying read-only lists (at least, that’s
what we think), this is good default behavior.

However, as the
components are replaced before the rendering starts, the search for
specific messages for these components fails as they are replaced with
other instances. Another problem is that ‘wrong’ user input is kept as
(temporary) instance data of the components. As these components are
replaced by new ones, your user will never see the wrong data when
setReuseItems is false.

That’s essentially what happens here. You’ll have to setReuseItems to true for your ListView.