Panel |
---|
borderStyle | solid |
---|
title | Table of contents |
---|
|
|
Initial situation: Paging done without Ajax
Say you have a page with a PagingNavigator and a DataView.
Code Block |
---|
DataView dataView = new MyDataView("dataView");
add(dataView);
PagingNavigator pager = new PagingNavigator("pager", dataView);
add(pager);
|
Adding Ajax
Now you want to do the paging be done via Ajax. But simply replacing the PagingNavigator with a AjaxPagingNavigator won't do it - the Page will be updated, but the DataView won't. To accomplish this, you need to do the following:
- surround the PagingNavigation and the DataView with a WebMarkupContainer
- tell the AjaxPagingNavigator to update the WebMarkupContainer
- update your HTML to match the new component hierarchy
Code Block |
---|
final WebMarkupContainer dataContainer = new WebMarkupContainer("dataContainer");
dataContainer.setOutputMarkupId(true);
add(dataContainer);
DataView dataView = new MyDataView("dataView");
dataContainer.add(dataView);
AjaxPagingNavigator pager = new AjaxPagingNavigator("pager", dataView) {
@Override
protected void onAjaxEvent(AjaxRequestTarget target) {
target.addComponent(dataContainer);
}
};
dataContainer.add(pager);
|
From a posting of Igor to the wicket-user list