Thursday, August 09, 2007

Radio controls with ajax in wicket 1.2

I needed to have two radio controls on a form. If one was selected, one panel would show. If the other was selected, the other panel would show. This is possible in Wicket 1.3, but not using Wicket 1.2.6. Here is how I got it to work in Wicket 1.2.6.

public static final int WITH_CONFIG = 0;
public static static int WITHOUT_CONFIG = 1;

private class FileUploadForm extends Form {

private WebMarkupContainer xmlContainer;
private WebMarkupContainer enginesContainer;

/**
* Construct.
*
* @param name
* Component name
*/
public FileUploadForm(String id, IModel model) {
super(id, model);

EdiInformation ediInfo = ((EdiInformation)getModelObject());

// set this form to multi-part mode (always needed for uploads!)
setMultiPart(true);

// Set maximum size to 10M
setMaxSize(Bytes.megabytes(10));

Button saveButton = new Button("saveButton", new ResourceModel("form.saveButton"));
add(saveButton);
add(new Button("cancelButton", new ResourceModel("form.cancelButton")) {
protected void onSubmit() {
setResponsePage(new ManagerMainPage(ManagerMainPage.TAB_EDI));
}
}.setDefaultFormProcessing(false));
add(new FeedbackPanel("feedback"));

enginesContainer = new WebMarkupContainer("enginesContainer");
enginesContainer.setOutputMarkupId(true);
enginesContainer.add(new EdiImportEnginesDropDownChoice("importEngine"));
enginesContainer.setVisible(false);

xmlContainer = new WebMarkupContainer("xmlContainer");
xmlContainer.setOutputMarkupId(true);
FileUploadField xmlInput = new FileUploadField("xmlInput");
ediInfo.setXmlInput(xmlInput);
xmlContainer.add(xmlInput);

RadioGroup option = new RadioGroup("option");
setupAjaxRadio(this, option, new Radio("withConfig", new Model(WITH_CONFIG)),
xmlContainer,enginesContainer);
setupAjaxRadio(this, option, new Radio("withoutConfig", new Model(WITHOUT_CONFIG)),
enginesContainer,xmlContainer);

add(enginesContainer);
add(xmlContainer);
add(option);

FileUploadField dataInput = new FileUploadField("dataInput");
ediInfo.setDataInput(dataInput);
add(dataInput);

add(new UploadProgressBar("progress", this));

}

private void setupAjaxRadio(final Form form, final RadioGroup radioGroup,
final Radio radio, final WebMarkupContainer visibleContainer,
final WebMarkupContainer hiddenContainer) {
radioGroup.add(radio.add(new AjaxEventBehavior("onchange") {
protected void onEvent(AjaxRequestTarget target) {
radioGroup.processInput();
hiddenContainer.setVisible(false);
visibleContainer.setVisible(true);
target.addComponent(form);
}
protected CharSequence getEventHandler() {
return getCallbackScript(new AppendingStringBuffer(
"wicketAjaxPost('").append(getCallbackUrl()).append(
"', wicketSerialize(document.getElementById('"
+ radio.getMarkupId() + "'))"), null, null);
}
}));
}

No comments: