在Wicket中动态添加组件到ListView

Question

在Wicket中动态添加组件到ListView

5

我想制作一个带有“添加”按钮的表单。按下“添加”按钮后，新面板将添加到wicket ListView元素中。我该怎么做？我希望能够添加无限数量的行。

编辑：InteractivePanelPage.html

<table>
    <tr>
        <td><a href="#" wicket:id="addPanelLink">Add Panel</a></td>
    </tr>
    <tr wicket:id="interactiveListView">
        <td>
        <span wicket:id="interactiveItemPanel"></span>
        </td>
    </tr>
</table>

InteractivePanelPage.java

// ... imports
public class InteractivePanelPage extends WebPage {
    public LinkedList<InteractivePanel> interactivePanels = new LinkedList<InteractivePanel>();

    private ListView<InteractivePanel> interactiveList;

    public InteractivePanelPage() {
        add(new AjaxLink<String>("addPanelLink") {
            private static final long serialVersionUID = 1L;

            @Override
            public void onClick(AjaxRequestTarget target) {
                try {
                    System.out.println("link clicked");

                    InteractivePanel newInteractivePanel = new InteractivePanel(
                            "interactiveItemPanel");
                    newInteractivePanel.setOutputMarkupId(true);

                    interactiveList.getModelObject().add(newInteractivePanel);
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        });

        interactivePanels.add(new InteractivePanel("interactiveItemPanel"));

        interactiveList = new ListView<InteractivePanel>("interactiveListView",
                new PropertyModel<List<InteractivePanel>>(this, "interactivePanels")) {
            private static final long serialVersionUID = 1L;

            @Override
            protected void populateItem(ListItem<InteractivePanel> item) {
                item.add(item.getModelObject());
            }
        };

        interactiveList.setOutputMarkupId(true);

        add(interactiveList);
    }

    public List<InteractivePanel> getInteractivePanels() {
        return interactivePanels;
    }
}

InteractivePanel.html

<html xmlns:wicket>
<wicket:panel>
<span><input type="button" value="BLAAA" wicket:id="simpleButton"/></span>
</wicket:panel>
</html>

InteractivePanel.java

// ... imports
public class InteractivePanel extends Panel {
    private static final long serialVersionUID = 1L;

    public InteractivePanel(String id) {
        super(id);

        add(new Button("simpleButton"));
    }
}

这根本不起作用。有人能看出原因吗？谢谢。

- tefozi

我认为你应该从这个链接开始： http://cwiki.apache.org/WICKET/forms-with-dynamic-elements.html - leonidv

1

要使其与ajax一起工作，您需要两件事：在ajax链接中更新的任何组件。在ListView周围放置一个WebMarkupContainer（例如<div wicket：id =“wmc”>），并在onClick（）中将该链接添加到AjaxRequestTarget中（target.addComponent（wmc））。目标包含将通过Ajax刷新的所有组件。并且，设置wmc.setOutputMarkupId（true）; 您不需要在newInteractivePanel上使用此功能。 - bert

1

你最好使用像RepeatingView这样的组件，这样你就不必将小部件包装在列表/模型中才能将它们添加到列表中。 - Eelco

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- bert · Accepted Answer

我猜你已经在ListView中展示了一个元素列表？那么你只需要向备份你的ListView的列表中添加新元素。请注意，如果你在构造函数中传递List，ListView将不会刷新这些项。

因此，不要使用

List<Person> personList = new LinkedList<Person>();
ListView<Person> personView = new ListView<Person("listview", personList);

你应该使用一个包装了列表的模型：

ListView<Person> personView = new ListView<Person("listview"
               , new PropertyModel<List<Person>>(this, "personList");

在此中，还有一个getPersonList()访问器。

你可以查看Legup并生成Wicket、Spring、JPA原型。在代码中，你会发现一个EventPage执行了这个操作。