在wicket中正确刷新包含面板的表格

Question

I have a wicket panel that contains a table. This is its constructor:

public NotFinishedExamsPanel(String id, final String userId, String[] egal) {
    super(id, new ResourceModel("notFinishedExams"), true);

    this.setOutputMarkupId(true);

    MySystem mysystem = ((MySession) Session.get()).getMySystem();
    String uid = ((MySession) Session.get()).getUsername();

    ArrayList<ExamData> exams = new ArrayList<ExamData>();
    try {
        if (!mysystem.account(userId).isStudent()) {
            return;
        }

        for (String exId : mysystem.exams()) {
            Exam ex = mysystem.exam(exId);
            if ((!(ex.hasResult(mysystem.account(userId).student().id()) && (ex.isPublished())))) {
                exams.add(new ExamData(mysystem.account(userId).student().id(), exId));
            }
        }

        ExamProvider exProv = new ExamProvider(exams);
        ArrayList<IColumn<ExamData, String>> columns = new ArrayList<IColumn<ExamData, String>>();
        columns.add(new PropertyColumn<ExamData, String>(new ResourceModel("title", "Titel"), "title"));
        columns.add(new PropertyColumn<ExamData, String>(new ResourceModel("date", "Datum"), "date"));
        columns.add(new PropertyColumn<ExamData, String>(new ResourceModel("time", "Uhrzeit"), "time"));
        columns.add(new PropertyColumn<ExamData, String>(new ResourceModel("location", "Ort"), "location"));
        columns.add(new PropertyColumn<ExamData, String>(new ResourceModel("status", "Status"), "status") {
            private static final long serialVersionUID = 7758862055950720446L;
            public void populateItem(Item item, String componentId, IModel rowModel) {
                Status status = ((ExamData) rowModel.getObject()).status;
                item.add(new ShowExamStatusPanel(componentId, status));
            }
        });
        columns.add(new PropertyColumn<ExamData, String>(new Model<String>(""), "status") {
            private static final long serialVersionUID = 7758862055950720446L;
            public void populateItem(Item item, String componentId, IModel rowModel) {
                String examId = ((ExamData) rowModel.getObject()).examId;
                String studentId = ((ExamData) rowModel.getObject()).studentId;
                Status status = ((ExamData) rowModel.getObject()).status;
                item.add(new ChangeExamStatusPanel(componentId, userId, examId, studentId, status));
            }
        });

        DefaultDataTable<ExamData, String> ddt = new DefaultDataTable<ExamData, String>("datatable", columns, exProv, 64);
        collapsible.add(ddt);
    } catch (NoSuchElementException e) {
        error(e.getMessage());
    }
}

collapsible is a WebMarkupContainer (div tag) inherited from the superclass (the superclass extends Panel). As you can see, in the last two columns I don't just put in a simple text, but a special panel.

ShowExamStatusPanel contains a label showing whether you are signed in for this exam or not:

class ShowExamStatusPanel extends Panel {
    private static final long serialVersionUID = 6359496765268390462L;

    public ShowExamStatusPanel(String id, final Status status) {
        super(id);
        this.setOutputMarkupId(true);
        Label showStatus = new Label("showStatus", new AbstractReadOnlyModel<String>() {
            private static final long serialVersionUID = 1L;

            public String getObject() {
                return ((status == Status.SIGNED_IN || status == Status.SIGNED_IN_CLOSED) ? (new ResourceModel("signed_in").getObject()) : (new ResourceModel("not_signed_in")).getObject());
            }
        });
        showStatus.add(new AttributeModifier("class", ((status == Status.SIGNED_IN || status == Status.SIGNED_IN_CLOSED) ? "examSignedUpColor" : "examNotSignedUpColor")));
        this.add(showStatus);
    }
}

ChangeExamStatusPanel contains a link that toggles your state for the exam (it signs in if you aren't and signs off otherwise):

class ChangeExamStatusPanel extends Panel {
    private static final long serialVersionUID = -8527825882073976118L;

    public ChangeExamStatusPanel(final String id, final String userId, final String examId, final String studentId, final Status status) {
        super(id);
        this.setOutputMarkupId(true);
        MySystem mysystem = ((MySession) Session.get()).getMySystem();
        AjaxLink cesl= new AjaxLink("changeExamStatusLink") {
            private static final long serialVersionUID = 4306084754982648221L;

            @Override
            public void onClick(AjaxRequestTarget target) {
                MySystem mysystem = ((MySession) Session.get()).getMySystem();
                try {
                    if (status == Status.SIGNED_IN) {
                        mysystem.exam(examId).removeParticipant(userId, studentId);
                    } else if (status == Status.NOT_SIGNED_IN) {
                        mysystem.exam(examId).addParticipant(userId, studentId);
                    }
                } catch (Exception e) {
                    NotFinishedExamsPanel.this.error(e.getMessage());
                }
                target.addChildren(NotFinishedExamsPanel.this, ChangeExamStatusPanel.class);
                target.addChildren(NotFinishedExamsPanel.this, ShowExamStatusPanel.class);
                target.add(NotFinishedExamsPanel.this);
            }
        };
        Label ceslText = new Label("linkText", ("[" + (new ResourceModel((status == Status.SIGNED_IN || status == Status.SIGNED_IN_CLOSED) ? "sign_off" : "sign_in")).getObject() + "]"));
        cesl.add(ceslText);
        ceslText.setVisibilityAllowed(status == Status.SIGNED_IN || status == Status.NOT_SIGNED_IN);
        this.add(cesl);         
    }
}

When the link is clicked, I want the table to be refreshed because the signed-in-state for one exam has changed. But I don't get this working. With the code above, nothing happens when I click on the link. If I then press F5 and refresh the whole page, I see the changes.

What do I have to do to refresh only the table (including inner panels)?

Here the html files, if you need them:

NotFinishedExamsPanel.html:

<html xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<head>
</head>
<body>
    <wicket:extend>
        <table wicket:id="datatable" class="datatable" style="margin:0px"></table>
    </wicket:extend>
</body>
</html>

NotFinishedExamsPanel$ShowExamStatusPanel.html:

<html xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<wicket:panel>
    <span wicket:id="showStatus"></span>
</wicket:panel>
</html>

NotFinishedExamsPanel$ChangeExamStatusPanel.html:

<html xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<wicket:panel>
    <a wicket:id="changeExamStatusLink" href="#"><span wicket:id="linkText"></span></a>
</wicket:panel>
</html>

ExamProvider.java:

class ExamProvider extends SortableDataProvider<ExamData, String> {
    private static final long serialVersionUID = 1476722834865141105L;
    private ExamDataProviderComparator comparator = new ExamDataProviderComparator();
    private List<ExamData> examList;

    public ExamProvider(List<ExamData> examList) {
        this.examList = examList;
        this.setSort("date", SortOrder.DESCENDING);
    }

    public Iterator<ExamData> iterator(long first, long count) {
        List<ExamData> newList = new ArrayList<ExamData>(this.examList);
        Collections.sort(newList, comparator);
        return newList.subList((int) first, (int) (first + count)).iterator();
    }

    public long size() {
        return this.examList.size();
    }

    public IModel<ExamData> model(final ExamData object) {
        return new AbstractReadOnlyModel<ExamData>() {
            private static final long serialVersionUID = -3048436145666499501L;

            public ExamData getObject() {
                return (ExamData) object;
            }
        };
    }

    class ExamDataProviderComparator implements Comparator<ExamData>, Serializable {
        private static final long serialVersionUID = 7660088204512731476L;

        public int compare(final ExamData o1, final ExamData o2) {
            PropertyModel<Comparable> model1 = new PropertyModel<Comparable>(o1, getSort().getProperty());
            PropertyModel<Comparable> model2 = new PropertyModel<Comparable>(o2, getSort().getProperty());

            int result = 0;
            if (model1.getObject() instanceof String && model2.getObject() instanceof String) {
                if (getSort().getProperty().equalsIgnoreCase("date")) {
                    try {
                        SimpleDateFormat sdt = new SimpleDateFormat("dd.MM.yyyy", Locale.GERMAN);
                        Date d1 = sdt.parse(model1.getObject().toString());
                        Date d2 = sdt.parse(model2.getObject().toString());
                        result = d1.compareTo(d2);
                    } catch (ParseException e) {
                        result = Collator.getInstance(Locale.GERMAN).compare(model1.getObject(), model2.getObject());
                    }
                } else {
                    result = Collator.getInstance(Locale.GERMAN).compare(model1.getObject(), model2.getObject());
                }
            } else {
                result = model1.getObject().compareTo(model2.getObject());
            }
            if (!getSort().isAscending()) {
                result = -result;
            }

            return result;
        }

    }

}

Answer 1

Wicket calls the constructor (Page or components) only when the page is constructed . So after adding the NotFinishedExamsPanel to AjaxRequestTarget , Wicket is refreshing the table based on the data in ArrayList<ExamData> exams (which is still the same).

I would propose you the following approach to impelemnt the ExamProvider (I was not able to test the code so take that only as a suggestion):

    static class ExamProvider extends SortableDataProvider<ExamData, String> {

        private static final long serialVersionUID = 1L;

        private static final String DEFAULT_SORT = "foobar";

        private IModel<List<ExamData>> examsModel = new ExamDataLoader();

        @Override
        public Iterator<ExamData> iterator(long first, long count) {
            SortParam<String> sort = getSort();

            List<ExamData> examDataList = examsModel.getObject();

            // TODO sort
            String orderByColumn = sort != null ? DEFAULT_SORT : sort.getProperty();
            boolean desc = sort != null ? true : !sort.isAscending();

            return examDataList.iterator();
        }

        @Override
        public long size() {
            return examsModel.getObject().size();
        };

        @Override
        public IModel<ExamData> model(ExamData data) {
            final String examId = data.getExamId();
            return new LoadableDetachableModel<ExamData>() {
                @Override
                protected ExamData load() {
                    MySystem mysystem =  MySession.get().getMySystem();
                    final long userId = mysystem.account(userId).student().id();
                    Exam ex = mysystem.exam(examId);
                    return new ExamData(mysystem.account(userId).student().id(), examId);
                }
            };
        }

        @Override
        public void detach() {
            examsModel.detach();
            super.detach();
        }
    }

With:

    static class ExamDataLoader extends LoadableDetachableModel<List<ExamData>> {

        private static final long serialVersionUID = 1L;

        @Override
        protected List<ExamData> load() {
            MySystem mysystem =  MySession.get().getMySystem();
            long userId = mysystem.account(userId).student().id();

            List<String> examsIds = mysystem.exams();
            List<ExamData> exams = new ArrayList<>(examsIds.size());
                for (String exId : mysystem.exams()) {
                    Exam ex = mysystem.exam(exId);
                    if ((!(ex.hasResult(userId) && (ex.isPublished())))) {
                        exams.add(new ExamData(mysystem.account(userId).student().id(), exId));
                    }
                }
                return exams;
            }
        }

To make your life a little bit easier, hide the static method get() in MySession with:

    public static MySession get() {
        return (MySession) Session.get();
    }

One last thing: Never change the visibility (or other attributes of a component) in the constructor (same argument as for your initial problem). So instead of:

 if (!mysystem.account(userId).isStudent()) { return; } 

overwrite the onConfigure method ad set the visibility based on given restrictions.