Wicket：在页面构造函数外部动态填充 RadioGroup

Question

我有一个页面根据我从上一页收到的列表显示一些单选选项。具体来说—— 第一页 --> 按下提交按钮 --> 生成列表 --> 本页 --> 填充单选组（使用列表视图）

问题是所有页面都在应用程序启动时初始化。因此，如果我在构造函数中填充我的单选组，我会得到一个空白页（因为列表是空的）。

此外，如果我在构造函数之外初始化我的无线电组或列表视图，我会收到 "wicket id not found" 错误（因为 wicket 在其上的 class 中找不到 wicket:id初始化）。

这是我的 HTML 代码：

<!DOCTYPE html>
<html xmlns:wicket="http://wicket.apache.org">
    <head>
    </head>
    <body>
        <wicket:panel>
            <form wicket:id="selectionPageForm">
                <table width="100%" cellpadding="5" class="datapass">
                    <tr>
                        <td>
                            <div wicket:id="selectGroup">
                                <span wicket:id="selectRepetor">
                                     <input type="radio" class="radioAlign" wicket:id="selection" checked="checked"/> 
                                    <label  class="check" style="float:none;" wicket:id="name">[bankName]</label>
                                </span>
                            </div>  
                        </td>
                    </tr>
                </table>
                <div wicket:id="feedback"></div>
            </form>
            <hr>
        </wicket:panel>
    </body>
</html>

这是我的 Java 页面： dataPassRegister 只是一个包含 String

的 ArrayList 的 POJO

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.markup.html.form.Radio;
import org.apache.wicket.markup.html.form.RadioGroup;
import org.apache.wicket.markup.html.list.ListItem;
import org.apache.wicket.markup.html.list.ListView;
import org.apache.wicket.markup.html.panel.FeedbackPanel;
import org.apache.wicket.model.CompoundPropertyModel;
import org.apache.wicket.model.Model;
import com.googlecode.wicket.jquery.ui.panel.JQueryFeedbackPanel;
import com.googlecode.wicket.jquery.ui.widget.dialog.AbstractFormDialog;
import com.googlecode.wicket.jquery.ui.widget.dialog.DialogButton;


public class SelectionPage extends AbstractFormDialog<DataPassRegister>{

    private final Form<DataPassRegister> form;
    private final FeedbackPanel feedback;
    protected final DialogButton btnSubmit = new DialogButton("Submit");
    protected final DialogButton btnCancel = new DialogButton(LBL_CANCEL);
    private ArrayList<String> nameList = new ArrayList(); 

    public SelectionPage(String id, String title, DataPassRegister dataPassRegister) {

        super(id, title, true);
        this.form = new Form<DataPassRegister>("selectionPageForm");

        final RadioGroup selectGroup = new RadioGroup("selectGroup");

        if(dataPassRegister.getNameList() != null){
            nameList = dataPassRegister.getNameList();
            System.out.println("In selection - In if condition - List : " + nameList.toString());
        }

        final ListView selectRepetor = new ListView("selectRepetor", nameList)
            {
            @Override
            protected void populateItem(final ListItem item)
            {
                final Radio radio = new Radio("selection", new Model(item.getModelObject().toString()));
                final Label label = new Label("name", new Model(item.getModelObject().toString()));
                item.add(radio);
                item.add(label);
            }
        };
        selectGroup.add(selectRepetor);

        this.feedback = new JQueryFeedbackPanel("feedback");

        this.form.add(selectGroup);
        this.form.add(this.feedback);
        this.add(this.form);
    }

    @Override
    public Form<?> getForm() {
        return this.form;
    }

    @Override
    public void setModelObject(DataPassRegister dataPassRegister)
    {
        this.setDefaultModel(new CompoundPropertyModel<DataPassRegister>(dataPassRegister));
    }

    @Override
    protected List<DialogButton> getButtons()
    {
        return Arrays.asList(this.btnSubmit, this.btnCancel);
    }

    @Override
    protected DialogButton getSubmitButton() {
        return this.btnSubmit;
    }

    @Override
    protected void onError(AjaxRequestTarget target) {
        target.add(this.feedback);
    }

    @Override
    protected void onSubmit(AjaxRequestTarget target) {

    }
}

如何在构造函数外部或在条件（列表不为空）下填充无线电组而不导致 wicket:id 错误？请帮忙。欢迎任何建议。

Answer 1

更新了代码片段

页面在 App init() 方法中挂载 - 所以 'instance' 创建了

mountPage("radioOptionPage", TestTargetPage.class);

首页 - Java

    private void addFormComponent(Form<Void> form) {

    final FeedbackPanel panel = new FeedbackPanel("statusbarpanel");
    panel.setOutputMarkupId(true);
    form.add(panel);

    AjaxFallbackButton button = new AjaxFallbackButton("submitbtn", form) {
        @Override
        protected void onSubmit(AjaxRequestTarget target, Form<?> form) {

            PageParameters parameters = new PageParameters();
            for(int i = 0; i < 3; i++){
                String random = RandomStringUtils.random(4, true, true);
                parameters.add(random, random);
            }
            setResponsePage(TestTargetPage.class, parameters);
        }
    };
    form.add(button);
}

首页 - 标记

<body>
<form wicket:id="imageForm">
    <div wicket:id="statusbarpanel"></div>
    <input type="submit" wicket:id="submitbtn" value="Click Me !!!"/>

</form>
</body>

第二页 - Java

public class TestTargetPage extends WebPage {

private FormModel model = new FormModel();

public TestTargetPage(PageParameters parameters) {

    List<String> options = new ArrayList<String>();

    if (parameters != null){
        List<INamedParameters.NamedPair> allNamed = parameters.getAllNamed();
        for (INamedParameters.NamedPair pair : allNamed){
            options.add(pair.getValue());
        }

        model.setObject(options);
    }

    Form<Void> form = new Form<Void>("targetForm");
    RadioChoice<String> radiOptions = addRadioGroups("radio");
    form.add(radiOptions);

    add(form);
}

private RadioChoice<String> addRadioGroups(String wicketId) {
    List<String> radioOptions = model.getObject();
    RadioChoice<String> radioChoice =  new RadioChoice<String>(wicketId, radioOptions);

    radioChoice.setOutputMarkupId(true);

    return radioChoice;
}}

第二页 - 标记

<body>
<h1>Wicket RadioChoice Example</h1>

<form wicket:id="targetForm">
    <p>
        <label>Radio options :</label>
        <br />
        <span wicket:id="radio"></span>
    </p>
    <input type="submit" value="Display" />
</form>

</body>

如果我没理解错的话，您需要的只是在页面加载时动态设置单选组。在这种情况下，您可以为页面设置模型对象，从上一页填充该模型对象，并将源页面的目标页面设置为默认模型对象，然后重定向到该目标页面。

为页面设置默认模型对象后，您应该可以根据需要设置单选按钮。单选按钮的值将来自页面的默认模型对象。

Answer 2

我终于成功了（在朋友的大力帮助下）.. 我在第一页中将 SelectionPage 设为 Panel.. 即 SelectionPage extends Panel

我在其中创建了这个函数以 re-populate 基于新列表的无线电组..

public void reloadList(DataPassRegister dataPassRegister) {

    this.form.remove("selectGroup");
    final RadioGroup selectGroup = new RadioGroup("selectGroup");

    selectGroup.setOutputMarkupId(true);
    selectGroup.setOutputMarkupPlaceholderTag(true);
    add(selectGroup);
    this.form.add(selectGroup);

    final ListView selectRepetor = new ListView("selectRepetor", dataPassRegister.getNameList())
        {
        @Override
        protected void populateItem(final ListItem item)
        {
            final Radio radio = new Radio("selection", new Model(item.getModelObject().toString()));
            final Label label = new Label("name", new Model(item.getModelObject().toString()));
            radio.setOutputMarkupId(true);
            radio.setOutputMarkupPlaceholderTag(true);
            item.add(radio);
            item.add(label);
            item.setOutputMarkupId(true);
            radio.add(new AjaxEventBehavior("onclick")
            {
                @Override
                protected void onEvent(AjaxRequestTarget target)
                {
                }
            });
        }
    };
    selectRepetor.setOutputMarkupId(true);
    selectRepetor.setOutputMarkupPlaceholderTag(true);
    selectGroup.add(selectRepetor);
}

然后在第一页上，我在初始化面板的地方添加了以下几行..

selectionPage.setOutputMarkupId(true);
selectionPage.setOutputMarkupPlaceholderTag(true);

这确保该面板稍后可变。最后，当我准备好用新列表填充面板时，我调用了上面的函数。即

selectionPage.reloadList(dataPassRegister);
target.add(selectionPage);                  

feedback.error("");
target.add(feedback);

这允许面板 re-populate 广播组。但是，截至目前，我必须添加反馈面板以确保对话框不会在按下提交时关闭。

Wicket：在页面构造函数外部动态填充 RadioGroup

Wicket: Dynamically populate RadioGroup outside page constructor

java

user-interface

listview

wicket

radio-group