How-to: Adding a custom action to the items on a list view
What we’ll do:
add a custom action button to each row of a list view
Example
In the case where we want to add a custom action to each instance of our entity on a list view, we have to register a viewprocessor (usually an EntityViewProcessorAdapter
) on the listview of its entityconfiguration.
Then in either the createViewElementBuilders
or render
method, we can edit the configured columns of each instance on the listview using the ViewElementBuilderMap
.
From the ViewElementBuilderMap
we can retrieve the SortableTableBuilder
, registered under SortableTableRenderingViewProcessor.TABLE_BUILDER
, on which we can register additional row processors to edit the content of a row.
Each row represents a single instance of the entity we are configuring.
To apply changes to the actions of an instance, we will need to find the actions cell in our row, which is registered under EntityListActionsProcessor.CELL_NAME
.
In this example, we will add a search button to the actions, which redirects us to google, with the query parameter being the property `name `of the entity instance found on the row.
@Override
protected void createViewElementBuilders(EntityViewRequest entityViewRequest, EntityView entityView, ViewElementBuilderMap builderMap) {
SortableTableBuilder sortableTableBuilder = builderMap.get(SortableTableRenderingViewProcessor.TABLE_BUILDER, SortableTableBuilder.class);
sortableTableBuilder.valueRowProcessor((ctx, row) -> {
ContainerViewElementUtils.find(row, EntityListActionsProcessor.CELL_NAME, TableViewElement.Cell.class).ifPresent(
actions -> {
MyEntity entity = EntityViewElementUtils.currentEntity(ctx, MyEntity.class);
String searchUrl= UriComponentsBuilder.fromUriString("https://www.google.com/")
.queryParam("q", entity.getName())
.toUriString();
actions.addFirstChild(
BootstrapUiBuilders.button().link()
.iconOnly(new GlyphIcon(GlyphIcon.SEARCH))
.url(searchUrl)
.build(ctx)
);
}
);
});
}