在Wicket 6编写的应用程序中,我(作为Wicket新手)尝试在表单中使用AjaxLink,以便能够更新表单的内容。
我的用例如下:通过ajax我希望能够在表单中添加/删除动态控件(文件上传控件)。
使用AjaxLink时,我无法进行ajax调用,以便向表单添加新的上传文件控件。另一方面,当我使用AjaxFallbackLink时,请求被提交到服务器并提交新控件。在这种情况下唯一的缺点是以前在表单上选择的值(来自国家/地区下拉列表的国家/地区)将丢失。
有人可以解释一下我如何使用ajax干净地添加/删除对表单的控件,而不会影响表单上选择的其他值?
Bellow是表单类的简化版本:
private final class MyForm extends BaseForm<MyFormBean> {
private static final long serialVersionUID = -9021809835323626044L;
private List<Image> sfImages = new ArrayList<>();
private MyForm(final String id, Sample sample) {
super(id, new CompoundPropertyModel<>(new MyFormBean(sample)));
setOutputMarkupId(true);
setMarkupId(id);
setMultiPart(true);
addWithFeedbackContainerAndLabel(new CountryDropDownChoice("country").setRequired(true));
final WebMarkupContainer ajaxContainer = new AjaxUpdatableContainer("ajaxContainer");
add(ajaxContainer);
ajaxContainer.add(new ListView<Image>("sfImages", sfImages) {
@Override
public void populateItem(final ListItem<Image> listItem) {
listItem.add(new UploadImagePanel("sfImage"));
}
});
add(new AjaxLink("addSFImage")
{
private static final long serialVersionUID = 974013580329804810L;
@Override
public void onClick(AjaxRequestTarget target) {
System.out.println("Ajax magic");
MyForm.this.sfImages.add(new DynamicImage("53a4c88f78306456988af612"));
if (target != null) {
target.add(ajaxContainer);
}
}
});
Button button = new SaveButton("saveButton");
add(button);
}