Vaadin 8 Grid - Dynamic Column and Editors

Vaadin 6 / 7 / 8
1

Hello,

I’m stuck with Vaadin 8 and Dynamic columns. My requirements are:

  1. Prepare a Grid with Dynamic Columns where the column type can be String, LocalDate, LoalDateTime, Number, etc.
  2. Based on the column type, the Grid column editor has to be changed. For example, if its LocalDate, I need a DateField as editor. If its a String, based on column data, I may have to use ComboBox or Radio Button Group
  3. I need to be able to add new row with the Editors available for user to pick and select (date fields or combo box)
  4. Render data from Database with editors enabled for user to edit

Problems faced:

  1. Vaadin Grid works fine with a POJO as backing data model. (example Grid). But my columns are dynamic. So I was unable to use a standard POJO. However, I referred this thread and got a workaround:
    https://vaadin.com/forum/#!/thread/16038356/16816582
    Issue: The issue is if I use a HashMap<String,Object>, I’m unable to use setEditor( new DateField() ) for the column editor. This throws the following error: “A Grid created without a bean type class literal or a custom property set doesn’t support finding properties by name”. (Note: WIthout the setEditor() method, the grid is able to render different types of column as text)

  2. So I dropped the idea of using Grid<HashMap<String,Object>> and created a POJO which will have String as attributes.
    Example:
    class HGRow {
    private String column1;
    private String column2;
    //getter/setter here
    }

List gridData = new ArrayList();
ListDataProvider dataProvider = new ListDataProvider<>( gridData );
Grid grid = new Grid();
grid.setDataProvider( dataProvider );

I used the following for editors:
grid.addComponentColumn( entity → {
DateField dt = editorProvider.getDateEditor();
return dt;
}).setCaption( “Ongoing Date” ).setId( String.valueOf( 123 ) );

This renders Date editor correctly. But I’m unable to set the value for the rows that are created.
To create a new row, I created instance of HGRow object, set the values for LocalDate as String and added to gridData list and invoked dataProvider.refreshAll(). I’m able to see new row in the Grid but the values set in the POJO are not set to the Editor.

How do I solve this problem?

2

Finally I’m able to get this working. I did minor change and its working now. The change/enhancement is below:
grid.addComponentColumn( entity → {
DateElement date = (DateElement) entity.getColumn1();
DateField dt = editorProvider.getDateEditor();
dt.setValue( date.getValue() );
return dt;
}).setCaption( “Date Column” ).setId( String.valueOf( 123 ) );