Attempt to set model object on null model of component: form:checkgroup - wicket

I'm trying to create a list of HITs (objects), where each has a checkbox next to it, so that I can select them and delete them all at once. I've made a form with a checkbox for each row in the table:
final HashSet<HIT> selectedValues = new HashSet<HIT>();
final CheckGroup checkgroup = new CheckGroup("checkgroup");
final Form form = new Form("form"){
#Override
public void onSubmit() {
super.onSubmit();
}
};
checkgroup.add(new CheckGroupSelector("checkboxSelectAll"));
UserHitDataProvider userHitDataProvider = new UserHitDataProvider(selectedIsReal, keyId, secretId);
final DataView<HIT> dataView = new DataView<HIT>("pageable", userHitDataProvider) {
private static final long serialVersionUID = 1L;
#Override
protected void populateItem(final Item<HIT> item) {
HIT hit = item.getModelObject();
item.add(new CheckBox("checkbox", new SelectItemUsingCheckboxModel(hit,selectedValues)));
item.add(new Label("hitName", String.valueOf(hit.getTitle())));
item.add(new Label("hitId", String.valueOf(hit.getHITId())));
}
};
//add checkgroup to form, form to page, etc.
I've also added a new class to take care of the selection/deletion:
public class SelectItemUsingCheckboxModel extends AbstractCheckBoxModel {
private HIT hit;
private Set selection;
public SelectItemUsingCheckboxModel(HIT h, Set selection) {
this.hit = h;
this.selection = selection;
}
#Override
public boolean isSelected() {
return selection.contains(hit);
}
#Override
public void select() {
selection.add(hit);
}
#Override
public void unselect() {
selection.remove(hit);
}
}
Everything renders fine, but I get an error when trying to submit:
Caused by: java.lang.IllegalStateException: Attempt to set model object on null model of component: form:checkgroup
at org.apache.wicket.Component.setDefaultModelObject(Component.java:3042)
at org.apache.wicket.markup.html.form.FormComponent.updateCollectionModel(FormComponent.java:1572)
at org.apache.wicket.markup.html.form.CheckGroup.updateModel(CheckGroup.java:160)
at org.apache.wicket.markup.html.form.Form$FormModelUpdateVisitor.component(Form.java:228)
at org.apache.wicket.markup.html.form.Form$FormModelUpdateVisitor.component(Form.java:198)
at org.apache.wicket.util.visit.Visits.visitPostOrderHelper(Visits.java:274)
at org.apache.wicket.util.visit.Visits.visitPostOrderHelper(Visits.java:262)
at org.apache.wicket.util.visit.Visits.visitPostOrder(Visits.java:245)
at org.apache.wicket.markup.html.form.FormComponent.visitComponentsPostOrder(FormComponent.java:422)
at org.apache.wicket.markup.html.form.Form.internalUpdateFormComponentModels(Form.java:1793)
at org.apache.wicket.markup.html.form.Form.updateFormComponentModels(Form.java:1757)
at org.apache.wicket.markup.html.form.Form.process(Form.java:913)
at org.apache.wicket.markup.html.form.Form.onFormSubmitted(Form.java:770)
at org.apache.wicket.markup.html.form.Form.onFormSubmitted(Form.java:703)
... 27 more
I think its some of the Ajax code breaking, since my SelectAllCheckBox button is also failing. Any ideas why? Is this even the best way to handle such a use case?

Your Checkgroup does not have a Model, thus Wicket can't copy the current state of the Model into a null object. You should use the constructor with an additional parameter representing the Model you want to store the value in.

Related

passing parameters to wicket panel

firstly wish you all a very happy new year.
i am moving my data tables in to a panel from webpage. i was using pageparameters to pass required parameters on clicking the link for retrieving data and displaying it in the next page. now that i have moved those tables in to a panel i am not sure how to forward those parameters in panels.
My calling Method:
final TextField<String> jobnumber = new TextField<String>("jobnumber ", Model.of(""));
jobnumber .setRequired(true);
final TextField<String> jobtype= new TextField<String>("jobtype", Model.of(""));
jobtype.setRequired(true);
Form form = new Form("form") {
#Override
public void onSubmit() {
final String jobnumber = jobnumber .getModelObject();
final String jobtype= jobtype.getModelObject();
PageParameters params= new PageParameters();
params.add("jobnumber ", jobnumber );
params.add("jobtype", jobtype);
new Job("jobs", params);
}
};
Button button = new Button("button");
form.add(button);
form.add(jobnumber);
form.add(jobtype);
add(form);
My Panel Constructor:
public class Job extends Panel {
public Job(String id, **PageParameters params**) {
super(id);
String jobnumber = params.get("jobNumber").toString();
String jobtype= params.get("jobtype").toString();
add(new Label("jobNumberLabel", jobnumber));
add(new Label("jobtypeLabel", jobtype));
list = retrieveJob(jobnumber, jobtype);
add(new ListView("agilejobs1", list) {
#Override
protected void populateItem(ListItem item) {
final Job job = (Job) item.getModelObject();
item.add(new Label("jobNumber", job.getJobNumber()));
item.add(new Label("jobdesc", job.getJobdesc()));
item.add(new Label("jobcount", job.getJobCount()));
}
});
}
}
i have tried to replace PageParameters with IModel but it did not work.
Please suggest.
Thanks
I would use a IModel<List<Job>>. You can create one in your panel like this:
public class JobPanel extends Panel {
public JobPanel(String id, String jobnumber, String jobtype) {
super(id);
IModel<List<Job>> jobListModel = new ListModel<Job>(retrieveJob(jobnumber,jobtype));
add(new ListView("agilejobs1", jobList) {
#Override
protected void populateItem(ListItem item) {
final Job job = (Job) item.getModelObject();
item.add(new Label("jobNumber", job.getJobNumber()));
item.add(new Label("jobdesc", job.getJobdesc()));
item.add(new Label("jobcount", job.getJobCount()));
}
});
}}
However, it would be better to construct the IModel<List<Jobs>> outside of the Panel and just pass it as an argument. The creation/setting of the model can be done in an Page, an onSubmit() in a Form or whatever method you like. Then the code becomes much cleaner, as the JobPanel will only be responsible for showing the data.

Redraw CellTable from MainPresenter after popup view is hidden

My MainPresenter has a CellTable with a button column. When u hit a button the presenter calls "addToPopupSlot(editPopup, true)". A editPopup appears with several settings u can make there. After pressing the save button on the popup view it sends data to the database which the CellTable in the MainPresenter wants to get.
My problem is: When I click on the save button, the table doesnt get updated. I have to either refresh the page or navigate from another Presenter back to the MainPresenter.
EditPopupPresenter
#Override
protected void onBind() {
super.onBind();
this.username = Cookies.getCookie("domusr");
// hours and minutes displayed in listboxes
for (int i = 0; i < TimeSettings.HOURS_RANGE; i++) {
getView().getBeginHoursLBX().addItem(String.valueOf(i));
getView().getEndHoursLBX().addItem(String.valueOf(i));
getView().getPauseHoursLBX().addItem(String.valueOf(i));
}
for (int i = 0; i < 60; i += TimeSettings.MINUTES_RANGE) {
getView().getBeginMinutesLBX().addItem(String.valueOf(i));
getView().getEndMinutesLBX().addItem(String.valueOf(i));
getView().getPauseMinutesLBX().addItem(String.valueOf(i));
}
getView().getSaveBTN().addClickHandler(new ClickHandler() {
#Override
public void onClick(ClickEvent event) {
DateTimeFormat dtf = DateTimeFormat.getFormat("yyyy-MM-dd");
final String startHours = getView()
.getBeginHoursLBX()
.getValue(
getView().getBeginHoursLBX().getSelectedIndex());
final String startMinutes = getView().getBeginMinutesLBX()
.getValue(
getView().getBeginMinutesLBX()
.getSelectedIndex());
final String endHours = getView().getEndHoursLBX().getValue(
getView().getEndHoursLBX().getSelectedIndex());
final String endMinutes = getView()
.getEndMinutesLBX()
.getValue(
getView().getEndMinutesLBX().getSelectedIndex());
final String pauseHours = getView()
.getPauseHoursLBX()
.getValue(
getView().getPauseHoursLBX().getSelectedIndex());
final String pauseMinutes = getView().getPauseMinutesLBX()
.getValue(
getView().getPauseMinutesLBX()
.getSelectedIndex());
final String projectId = getView().getProjectIdLBL().getText();
final java.sql.Date date = new java.sql.Date(dtf.parse(
getView().getDateLBL().getText()).getTime());
dispatcher.execute(
new InsertTimesIntoDB(Integer.parseInt(startHours),
Integer.parseInt(startMinutes), Integer
.parseInt(endHours), Integer
.parseInt(endMinutes), Integer
.parseInt(pauseHours), Integer
.parseInt(pauseMinutes), Integer
.parseInt(projectId), date, username),
new AsyncCallback<InsertTimesIntoDBResult>() {
#Override
public void onFailure(Throwable caught) {
}
#Override
public void onSuccess(InsertTimesIntoDBResult result) {
}
});
getView().hide();
}
});
}
editColumn in MainPresenter (onBind())
// edit column
Column<Booking, String> editColumn = new Column<Booking, String>(
new ButtonCell()) {
#Override
public String getValue(Booking booking) {
return "edit";
}
};
editColumn.setFieldUpdater(new FieldUpdater<Booking, String>() {
#Override
public void update(int index, Booking object, String value) {
// pop up widget addToSlot call
editPopup.getView().getDateLBL()
.setText(String.valueOf(object.getFullDate()));
editPopup.getView().getProjectIdLBL()
.setText(String.valueOf(1234567));
editPopup.getView().getBeginHoursLBX()
.setItemSelected(object.getStartHours(), true);
editPopup
.getView()
.getBeginMinutesLBX()
.setItemText(
minutesRange.getIndex(object
.getEndMinutes()),
String.valueOf(object.getStartMinutes()));
editPopup.getView().getEndHoursLBX()
.setItemSelected(object.getEndHours(), true);
editPopup
.getView()
.getEndMinutesLBX()
.setItemText(
minutesRange.getIndex(object
.getEndMinutes()),
String.valueOf(object.getEndMinutes()));
editPopup.getView().getPauseHoursLBX()
.setItemSelected(object.getPauseHours(), true);
editPopup
.getView()
.getPauseMinutesLBX()
.setItemText(
minutesRange.getIndex(object
.getEndMinutes()),
String.valueOf(object.getPauseMinutes()));
addToPopupSlot(editPopup, true);
}
});
getView().getTimeTable().addColumn(editColumn);
I think you have some solutions here. If I were you I would do next steps:
Create a listener of events in the MainPresenter.
When you finished
update your DB (after pressing save in your popup); I´d fire an
event.
When the MainPresenter receives the event, you go to the DB
and fetch the data (filtering it using getVisibleRange()).
Refresh the CellTable using setRowData(...) method (passing correctly the arguments)
Other option is create a ListDataProvider associate with the CellTable, and call refresh on it.

Gwt Simple pager issues with a column sort handler

I have set up an AsyncDataProvider for my CellTable and added it to a SimplePager. I have hooked up a ListHandler to take care of sorting based on a column.
When I click the header of that column, the data doesn't change but on going to the next/previous page within the pager the data is then sorted. Also before the column is clicked there is no visual indicator on the column that would indicate that it is meant to be sortable.
How can I get the data to update when I click the header of the Column?
Here's my code snippet
service.getHosts(environment, new AsyncCallback<Set<String>>() {
#Override
public void onSuccess(final Set<String> hosts) {
final List<String> hostList = new ArrayList<String>(hosts);
//Populate the table
CellTable<String> hostTable = new CellTable<String>();
TextColumn<String> hostNameColumn = new TextColumn<String>(){
#Override
public String getValue(String string){
return string;
}
};
NumberCell numberCell = new NumberCell();
Column<String, Number> lengthColumn = new Column<String, Number>(numberCell){
#Override
public Number getValue(String string) {
return new Integer(string.length());
}
};
AsyncDataProvider<String> dataProvider = new AsyncDataProvider<String>() {
#Override
protected void onRangeChanged(HasData<String> data) {
int start = data.getVisibleRange().getStart();
int end = start + data.getVisibleRange().getLength();
List<String> subList = hostList.subList(start, end);
updateRowData(start, subList);
}
};
// Hooking up sorting
ListHandler<String> columnSortHandler = new ListHandler<String>(hostList);
columnSortHandler.setComparator(lengthColumn, new Comparator<String>(){
#Override
public int compare(String arg0, String arg1) {
return new Integer(arg0.length()).compareTo(arg1.length());
}
});
hostTable.setPageSize(10);
hostTable.addColumnSortHandler(columnSortHandler);
hostTable.addColumn(hostNameColumn,"Host Name");
lengthColumn.setSortable(true);
hostTable.addColumn(lengthColumn, "Length");
VerticalPanel verticalPanel = new VerticalPanel();
SimplePager pager = new SimplePager();
pager.setDisplay(hostTable);
dataProvider.addDataDisplay(hostTable);
dataProvider.updateRowCount(hosts.size(), true);
verticalPanel.add(hostTable);
verticalPanel.add(pager);
RootPanel.get().add(verticalPanel);
}
#Override
public void onFailure(Throwable throwable) {
Window.alert(throwable.getMessage());
}
});
I'm not sure how to make sure that the list is shared by both the table and the Pager. Before adding the pager I was using
ListDataProvider<String> dataProvider = new ListDataProvider<String>();
ListHandler<String> columnSortHandler = new ListHandler<String>(dataProvider.getList());
The AsyncDataProvider doesn't have the method getList.
To summarize I want the data to be sorted as soon as the column is clicked and not after I move forward/backward with the pager controls.
As per the suggestion I have changed the code for the AsyncDataProvider to
AsyncDataProvider<String> dataProvider = new AsyncDataProvider<String>() {
#Override
protected void onRangeChanged(HasData<String> data) {
int start = data.getVisibleRange().getStart();
int end = start + data.getVisibleRange().getLength();
List<String> subList = hostList.subList(start, end);
// Hooking up sorting
ListHandler<String> columnSortHandler = new ListHandler<String>(hostList);
hostTable.addColumnSortHandler(columnSortHandler);
columnSortHandler.setComparator(lengthColumn, new Comparator<String>(){
#Override
public int compare(String v0, String v1) {
return new Integer(v0.length).compareTo(v1.length);
}
});
updateRowData(start, subList);
}
};
But there is no change in the behavior even after that. Can someone please explain the process. The GWT showcase app seems to have this functionality but how they've done it isn't all that clear.
When using an AsyncDataProvider both pagination and sorting are meant to be done on the server side. You will need an AsyncHandler to go with your AsyncDataProvider:
AsyncHandler columnSortHandler = new AsyncHandler(dataGrid) {
#Override
public void onColumnSort(ColumnSortEvent event) {
#SuppressWarnings("unchecked")
int sortIndex = dataGrid.getColumnIndex((Column<Entry, ?>) event.getColumn());
boolean isAscending = event.isSortAscending();
service.getPage(0, sortIndex, isAscending, new AsyncCallback<List<Entry>>() {
public void onFailure(Throwable caught) {
}
public void onSuccess(List<Entry> result) {
pager.setPage(0);
provider.updateRowData(0, result);
}
});
}
};
dataGrid.addColumnSortHandler(columnSortHandler);
Clicking on a column header will then fire a columnSortEvent. Then you have to get the column clicked. I am overloading my servlet to provide both sorting and pagination, so I pass a -1 for the column index when only pagination is desired.
provider = new AsyncDataProvider<Entry>() {
#Override
protected void onRangeChanged(HasData<Entry> display) {
final int start = display.getVisibleRange().getStart();
service.getPage(start, -1, true, new AsyncCallback<List<Entry>>() {
#Override
public void onFailure(Throwable caught) {
}
#Override
public void onSuccess(List<Entry> result) {
provider.updateRowData(start, result);
}
});
}
};
provider.addDataDisplay(dataGrid);
provider.updateRowCount(0, true);
Then your servlet implementation of getPage performs the sorting and pagination. The whole thing is much easier to follow with separate event handlers.
I think the problem is with the ListHandler initialization. You are passing hostList as a parameter to List Handler and in onRangeChange method you are calling updateRowData with a different list (sublist).
Make sure you use the same list in both the places.
or
Move your ListHander initialization and cellTable.addColumnSortHandler method call to onRangeChange method after updateRowData call.

Multi select drop down in Wicket

How to implement multiple select drop down in Wicket. I am able to create multi select drop down view using bootstrap but I am not able to get how to relate selected options with IModel of drop down component? Is there any possibility in Wicket? I do not want to use ListMultipleChoice.
Here is a sample code.
{
private IModel<List<? extends String>> statusChoices;
private DropDownChoice<String> status;
private String statusFilter = "firstChoice";
// List of Items in drop down
statusChoices = new AbstractReadOnlyModel<List<? extends String>>() {
#Override
public List<String> getObject() {
List<String> list = new ArrayList<String>();
list.add("firstChoice");
list.add("secondChoice");
list.add("thirdChoice");
return list;
}
};
status = new DropDownChoice<String>("status",new PropertyModel<String>(this, "statusFilter"), statusChoices);
status.add(new AjaxFormComponentUpdatingBehavior("onchange") {
#Override
protected void onUpdate(AjaxRequestTarget target) {
if(statusFilter.equals("firstChoice"))
// Do Somthing
else
// Do Somthing
}
});
}

Handling onClick for a checkbox in a CellTable Header

I am trying to create a CellTable that has a column with some text and a checkbox, which will be used as a select all checkbox (see the drawing below, "cb" is checkbox). Currently I am using an class derived from Header and overriding it's render method to output the text and a checkbox. I am overriding onBrowserEvent() however it is only giving me onChange events, which would work fine except that the checkbox doesn't function correctly. Does anyone have any ideas on this?
+-------+------------+
| col 1 | Select All |
| | cb |
+-------+------------+
| row 1 | cb |
+-------+------------+
The issues I'm having with the checkbox is that when it's not checked, you have to click it twice for the checkmark to appear (at least on Chrome), even though it's "checked" property is true the first time. One click unchecks it correctly.
Here is some code:
Setup the CellTable columns:
/** Setup the table's columns. */
private void setupTableColumns() {
// Add the first column:
TextColumn<MyObject> column1 = new TextColumn<MyObject>() {
#Override
public String getValue(final MyObject object) {
return object.getColumn1Text();
}
};
table.addColumn(macColumn, SafeHtmlUtils.fromSafeConstant("Column1"));
// the checkbox column for selecting the lease
Column<MyObject, Boolean> checkColumn = new Column<MyObject, Boolean>(
new CheckboxCell(true, false)) {
#Override
public Boolean getValue(final MyObject object) {
return selectionModel.isSelected(object);
}
};
SelectAllHeader selectAll = new SelectAllHeader();
selectAll.setSelectAllHandler(new SelectHandler());
table.addColumn(checkColumn, selectAll);
}
My Select All Header:
public static class SelectAllHeader extends Header<Boolean> {
private final String checkboxID = "selectAllCheckbox";
private ISelectAllHandler handler = null;
#Override
public void render(final Context context, final SafeHtmlBuilder sb) {
String html = "<div>Select All<div><input type=\"checkbox\" id=\"" + checkboxID + "\"/>";
sb.appendHtmlConstant(html);
}
private final Boolean allSelected;
public SelectAllHeader() {
super(new CheckboxCell());
allSelected = false;
}
#Override
public Boolean getValue() {
Element checkboxElem = DOM.getElementById(checkboxID);
return checkboxElem.getPropertyBoolean("checked");
}
#Override
public void onBrowserEvent(final Context context, final Element element, final NativeEvent event) {
Event evt = Event.as(event);
int eventType = evt.getTypeInt();
super.onBrowserEvent(context, element, event);
switch (eventType) {
case Event.ONCHANGE:
handler.onSelectAllClicked(getValue());
event.preventDefault();
break;
default:
break;
}
}
public void setSelectAllHandler(final ISelectAllHandler handler) {
this.handler = handler;
}
}
It looks like you're rendering a non-checked checkbox whenever you render the header, which could be wiping out the selection state whenever the celltable re-renders.
Try storing the checked state and rendering the checkbox with the state. It looks like you're half way there with allSelected, you're just not using it.
EDIT Here is a working implementation I've just written for Zanata (see SearchResultsView.java). The HasValue interface is implemented so that value change events can be handled in a standard way. I have not overridden the render method, if you want to do so make sure you use getValue() to determine whether you render a checked or an unchecked checkbox. The selection/de-selection logic is handled in the associated presenter class (see SearchResultsPresenter.java).
private class CheckboxHeader extends Header<Boolean> implements HasValue<Boolean> {
private boolean checked;
private HandlerManager handlerManager;
public CheckboxHeader()
{
//TODO consider custom cell with text
super(new CheckboxCell());
checked = false;
}
// This method is invoked to pass the value to the CheckboxCell's render method
#Override
public Boolean getValue()
{
return checked;
}
#Override
public void onBrowserEvent(Context context, Element elem, NativeEvent nativeEvent)
{
int eventType = Event.as(nativeEvent).getTypeInt();
if (eventType == Event.ONCHANGE)
{
nativeEvent.preventDefault();
//use value setter to easily fire change event to handlers
setValue(!checked, true);
}
}
#Override
public HandlerRegistration addValueChangeHandler(ValueChangeHandler<Boolean> handler)
{
return ensureHandlerManager().addHandler(ValueChangeEvent.getType(), handler);
}
#Override
public void fireEvent(GwtEvent<?> event)
{
ensureHandlerManager().fireEvent(event);
}
#Override
public void setValue(Boolean value)
{
checked = value;
}
#Override
public void setValue(Boolean value, boolean fireEvents)
{
checked = value;
if (fireEvents)
{
ValueChangeEvent.fire(this, value);
}
}
private HandlerManager ensureHandlerManager()
{
if (handlerManager == null)
{
handlerManager = new HandlerManager(this);
}
return handlerManager;
}
}