Directory

← Back

Enhanced Crud

Enhanced CRUD offers read only mode, canceling save and access to Editor buttons

Author

Rating

Popularity

100+

Enhanced CRUD is an improved version of the Vaadin CRUD component. The most notable differences are

Features

  • Toolbar footer can be hidden

  • There is read only mode, where Editor dialog has only the close button and data cannot be edited

  • A new PreSaveEvent is triggered before bean is committed, so that fully customized saving logic is possible to be added.

  • Cancel save. You can do additional validation in save listener and cancel if needed. Then edits are reverted.

  • Access to Editor dialog buttons. Button captions can be changed, buttons can be hidden.

  • Possible to disable confirm dialog on cancel actions

Fixes

This component requires Vaadin 14+ and npm mode. Compatibility mode not supported. Material theme is not supported.

Vaadin 23

There is no version planned for Vaadin 23. Important features from this add-on has been integrated to CRUD component of Vaadin 23 instead.

Vaadin Pro

This component is available in the Vaadin Pro subscription. It is still open source, but you need to have a valid CVAL license in order to use it. Read more at: Pricing

Major pieces of development of this add-on has been sponsored by customers of Vaadin. Read more about Expert on Demand at: Support and Pricing

Sample code

Crud<Person> crud = new Crud<>(Person.class, createPersonEditor());
PersonDataProvider dataProvider = new PersonDataProvider();

crud.setDataProvider(dataProvider);

// Use cancelEdit in PreSaveEvent
// PreSaveEvent is dispatched before editor writes the bean
crud.addPreSaveListener(e -> {
	BinderCrudEditor<Person> crudEditor = (BinderCrudEditor<Person>) crud.getEditor();
	TextField textField = (TextField) crudEditor.getBinder().getFields().findFirst().get();
	if (textField.getValue().equals("noname")) {
		crud.cancelSave();
 }
});
crud.addSaveListener(e -> {
    dataProvider.persist(e.getItem());
});
crud.addDeleteListener(e -> dataProvider.delete(e.getItem()));

crud.getGrid().removeColumnByKey("id");
crud.addThemeVariants(CrudVariant.NO_BORDER);

// Toggle display of toolbar
Button hideToolbar = new Button("Hide toolbar");
hideToolbar.addClickListener(buttonClickEvent -> crud.setToolbarVisible(!crud.isToolbarVisible()));

// Set the whole Grid and Editor to be read only, in this mode
// dialog is also not editable and show only close button
Button readOnly = new Button("Read only");
readOnly.addClickListener(buttonClickEvent -> {
    crud.setReadOnly(!crud.isReadOnly());
});

// There are getters for the buttons, so that they can be modified
// individually
Button changeEditorButtons = new Button("Change Editor Buttons");
changeEditorButtons.addClickListener(buttonClickEvent -> {
    crud.getDelete().setText("Restore");
    crud.getCancel().setText("Quit");
    crud.getSave().getElement().setAttribute("Style", "display: none;");
    crud.getCancel().addClickListener(clickEvent -> crud.setToolbarVisible(!crud.isToolbarVisible()));
});

// Remove edit column and open editor by click listener
Button changeEditorOpening = new Button("Change Editor Opening");
changeEditorOpening.addClickListener(buttonClickEvent -> {
	crud.setEditOnClick(!crud.isEditOnClick());
});

// There are getters for the buttons, so that they can hidden 
// individually
Button disableDelete = new Button("Disable Delete");
disableDelete.addClickListener(buttonClickEvent -> {
    crud.addEditListener(event -> {
        crud.getDelete().setVisible(false);
    });
});

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Version 1.3.0

  • Fixed issues with Vaadin 14.9.2+
  • Web component prefix has been changed from vaadin-* to vcf-*, to allow mixed use with normal Vaadin Crud.
Released
2023-01-09
Maturity
BETA
License
CVAL 3.0

Compatibility

Framework
Vaadin 14
Browser
Firefox
Safari
Google Chrome
iOS Browser
Android Browser
Internet Explorer
Microsoft Edge

Enhanced Crud - Vaadin Add-on Directory

Enhanced CRUD offers read only mode, canceling save and access to Editor buttons Enhanced Crud - Vaadin Add-on Directory
Enhanced CRUD is an improved version of the Vaadin CRUD component. The most notable differences are ## Features - Toolbar footer can be hidden - There is read only mode, where Editor dialog has only the close button and data cannot be edited - A new PreSaveEvent is triggered before bean is committed, so that fully customized saving logic is possible to be added. - Cancel save. You can do additional validation in save listener and cancel if needed. Then edits are reverted. - Access to Editor dialog buttons. Button captions can be changed, buttons can be hidden. - Possible to disable confirm dialog on cancel actions ## Fixes - event.getItem() returns new item if opened with new item, https://github.com/vaadin/vaadin-crud-flow/issues/204 - Possible NPE: "Cannot provide an id for null item.", https://github.com/vaadin/vaadin-crud-flow/pull/216 This component requires Vaadin 14+ and npm mode. Compatibility mode not supported. Material theme is not supported. ### Vaadin 23 There is no version planned for Vaadin 23. Important features from this add-on has been integrated to CRUD component of Vaadin 23 instead. ### Vaadin Pro This component is available in the Vaadin Pro subscription. It is still open source, but you need to have a valid CVAL license in order to use it. Read more at: [Pricing](https://vaadin.com/pricing) ### Sponsored development Major pieces of development of this add-on has been sponsored by customers of Vaadin. Read more about Expert on Demand at: [Support](https://vaadin.com/support) and [Pricing](https://vaadin.com/pricing)
Online