TODO : Explain
Daily Archives: August 15, 2011
Wicket Ajax Radio
Wicket provides couple of built-in ajax enabled components for example AjaxButton, AjaxLink, and most importantly AjaxCheckBox and astonishingly there is no AjaxRadio,
Potential Reasons for no built-in ajax enabled Radio Component
- Point 1
- Point 2
So lets create that missing component, Here is how that component would work
I would be using the following built-in components from Wicket core libraray:
- Radio (To render HTML Radio)
- RadioGroup (Radios don’t exist alone, every Radio is bound to a group, RadioGroup will hold the current selection)
- AjaxEventBehavior (onClick behavior is bound to each individual Radio )
- Form (To post the current status of Radio, i.e, which one is currently selected)
- Listview (repeatedly display all the Radio, this is going to be dynamaic )
I am going to create two classes for this component :
- AjaxRadio : This class is pretty simple it simple adds Wicket Radio and AjaxEventBehaior to each Radio
- AjaxRadioPanel : This is the main component.
AjaxRadio
AjaxRadio is extending Radio (Wicket core component) and adding onclick ajax behavior, this event will submit the current status of the Radio component to Server whenever the even occurs (onClick in this case)
public abstract class AjaxRadio extends Radio {
private static final long serialVersionUID = 1L;
public abstract void onAjaxEvent(AjaxRequestTarget target);
public AjaxRadio(String id, IModel model) {
super(id, model);
addAjaxBehavior();
setOutputMarkupId(true);
}
private void addAjaxBehavior() {
add(new AjaxEventBehavior("onclick") {
private static final long serialVersionUID = 1L;
protected void onEvent(final AjaxRequestTarget target) {
RadioGroup radioGroup = getEnclosingRadioGroup();
radioGroup.processInput();
onAjaxEvent(target);
}
protected final CharSequence getEventHandler() {
return generateCallbackScript(new AppendingStringBuffer("wicketAjaxPost('")
.append(getCallbackUrl())
.append("', wicketSerialize(Wicket.$('")
.append(AjaxRadio.this.getMarkupId())
.append("'))"));
}
});
}
private RadioGroup getEnclosingRadioGroup() {
RadioGroup group = (RadioGroup) findParent(RadioGroup.class);
if (group == null) {
throw new WicketRuntimeException("Radio component ["
+ getPath()
+ "] cannot find its parent RadioGroup. All Radio components must be a child of or below in the hierarchy of a RadioGroup component.");
}
return group;
}
}
AjaxRadioPanel
The main job of this class is to repeatedly add the AjaxRadio component, and provide a callback if the Radio is update, so that client can do some operation
public abstract class AjaxRadioPanel extends Panel {
private static final long serialVersionUID = 1L;
protected abstract void onRadioSelect(AjaxRequestTarget target, T newSelection);
public AjaxRadioPanel(String id, List items, String propertyExpression) {
this(id, items, null, propertyExpression);
}
public AjaxRadioPanel(String id, List items, T currentSelection, String labelPropertyExpression) {
super(id);
add(buildForm(items, currentSelection, labelPropertyExpression));
}
private Form buildForm(List items, T currentSelection, String labelPropertyExpression) {
Form form = new Form("form");
RadioGroup group = new RadioGroup("radioGroup", new Model(currentSelection));
group.add(newRadios(group, items, labelPropertyExpression));
form.add(group);
return form;
}
private Component newRadios(final RadioGroup group, List items, final String labelPropertyExpression) {
return new ListView("radioButtons", items) {
private static final long serialVersionUID = 1L;
protected void populateItem(ListItem item) {
item.add(newAjaxRadioCell(group, item));
item.add(new Label("label", new PropertyModel(item.getModel(), labelPropertyExpression)));
}
};
}
private AjaxRadio newAjaxRadioCell(final RadioGroup group, ListItem item) {
return new AjaxRadio("radio", item.getModel()) {
private static final long serialVersionUID = 1L;
@Override
public void onAjaxEvent(AjaxRequestTarget target) {
onRadioSelect(target, group.getModelObject());
}
};
}
}
How to Use this component
Simply add AjaxRadioPanel to your container
add(new AjaxRadioPanel(RADIO_PANEL_ID, getPersons(), "name") {
private static final long serialVersionUID = 1L;
@Override
protected void onRadioSelect(AjaxRequestTarget target, ValueMap newSelection) {
info("You have selected " + newSelection.getString("name"));
target.addComponent(feedbackPanel);
}
});
TODO : Update more…
Get the source code from Git Hub
Wicket Editable Grid
NOTE : Editable Grid is now part of Wicket Stuff
Editable Grid, can be downloaded from M2 Repo and Sonatype Repo
Wicket users desperately need a grid with add/edit/delete functionality at once, Here are the couple of forums :
Wicket Stuff does provide a component, however it does not have the ‘add’ functionality. Hence i have decided to write my own ;-).
Sample Screen Shot
How to Use this Component
It is very simple, Editable grid needs the following:
- Columns, there are lots of predefined columns, however you can sub class existing classes to provide your own customized one.
- List of Row Objects, it may be empty.
- Backing object for the footer, Which lets you add new objects
add(new EditableGrid("grid", getColumns(), getPersons(), new Person()) {
private static final long serialVersionUID = 1L;
@Override
protected void onError(AjaxRequestTarget target) {
target.addComponent(feedbackPanel);
}
});
private List> getColumns() {
List> columns = new ArrayList>();
columns.add(new RequiredEditableTextFieldColumn(new Model("Name"), "name", false));
columns.add(new RequiredEditableTextFieldColumn(new Model("Address"), "address"));
columns.add(new AbstractEditablePropertyColumn(new Model("Age"), "age") {
private static final long serialVersionUID = 1L;
public EditableCellPanel getEditableCellPanel(String componentId) {
return new EditableRequiredDropDownCellPanel(componentId, this, Arrays.asList("10","11","12","13","14","15"));
}
});
return columns;
}
How It Works
TODO : Explain..
Features
- Feature 1
- Feature 2
- Feature 3
TODO : Update….
Grid in Action
Get the source code from Github and do mvn jetty:run in the command prompt.
Seamless File IO
How to Improve a project
Improving a project involves, trying to be professional, Here is what i do
Continuous Learning
Divide your time with the following equation
168 hours in a week= 40 (for employer) + 20 (to sharpen ones skills) + 56 (for sleep) + 52 (for the rest)
Spend 20 hours a week sharpening your skills, Here is what i try to learn/practice.
- Coding Conventions
- 3Ds (Design Patterns + Design principles+ Disciplines)
- Katas
Humble Confrontation
Confrontation is really required for the team to grow and come up with innovative ideas, it may increase knowledge sharing. However the confrontation should be in a humble manner, the moment it crosses that boundary the team is heading towards being divided into pieces.
- Always ask questions and be humble.
Try to Improve Code Base in Small Steps
We should stick to the statement
Don’t comment the bad code rewrite it
I daily encounter with people who says lots of bad things about their project, but don’t have the courage to improve it and to make the matter worst they never do their work in an elegant way, this kind of people should be handled in a special way.
- Don’t commit the mistakes that have been done before
- Try to stick on what has been done in awesome++ manner
- Do not check in with out refactoring and test cases.
- Don’t sacrifice the quality only for the sake of speedy delivery (Project may have negative impact afterwards)
- Always keep in mind two things CHANGE + MAINTAINIBALITY
Get The Big Picture Before Starting Any Task
- Clarify all the questions up front.
- Analyse the impact both inward and outward
- Discuss with the people who know, don’t be shy 😉
- Keep posting to the people who are concerned.

