Adding Checkboxes to Vaadin Grids

Question

I have constructed a Grid in Vaadin 14 using a parser to extract from files as shown below:

 Grid<String[]> grid = new Grid<>();
        
        try {
            List<String[]> entries = reader.readAll();
            
            // Assume the first row contains headers
            String[] headers = entries.get(0);
            
            for (int i = 0; i < headers.length-1; i++) {
                final int columnIndex = i;
                String header = headers[i];
                String humanReadableHeader = SharedUtil.camelCaseToHumanFriendly(header);
                grid.addColumn(str -> str[columnIndex]).setHeader(humanReadableHeader).setSortable(true).setWidth("100px");
                
            }
            
            grid.setItems(entries.subList(1, entries.size()));

What I want to do next is add a CheckBox to every row that would return a visualization of the data in the corresponding row. So my question is two-fold:

Is there a function that already exists to emulate this behavior via clicking anywhere on a row?
If not, what would be the best way to initialize a Grid to accommodate this?

I don't think that I fully understand your question. But if you just want to add checkboxes you can use the addColumn method that takes a ComponentRenderer — Simon Martinelli, Jun 22 '21 at 05:51
Are you talking about multi-select checkboxes, or checkboxes that are not tied to the selection state? — Anna Koskinen, Jun 22 '21 at 09:27
@SimonMartinelli that's correct, so my question would be how to initialize the Grid to handle both the csv data and a corresponding checkbox for each row of data — schaphekar, Jun 22 '21 at 17:02
@AnnaKoskinen it would be more of a single selection, where every row in the Grid would have a checkbox, but would only allow one to be checked at a time — schaphekar, Jun 22 '21 at 17:04
I still don't understand your question. Checkout https://vaadin.com/components/vaadin-grid/java-examples/using-components — Simon Martinelli, Jun 23 '21 at 06:03
@SimonMartinelli so since I am constructing my Grid from CSV data, my Grid is initialized as Grid where each row corresponds to a row from a file. Now, I would like to add a Checkbox component to each row but I am not sure how to initialize Grid. — schaphekar, Jun 23 '21 at 16:30

score 4 · Accepted Answer · answered Jun 24 '21 at 08:53

Simply add a component column:

Grid<String[]> grid = new Grid<>();
  
try {
    List<String[]> entries = reader.readAll();
        
    // Assume the first row contains headers
    String[] headers = entries.get(0);
        
    for (int i = 0; i < headers.length-1; i++) {
       final int columnIndex = i;
       String header = headers[i];
       String humanReadableHeader = SharedUtil.camelCaseToHumanFriendly(header);
       grid.addColumn(str -> str[columnIndex]).setHeader(humanReadableHeader).setSortable(true).setWidth("100px");
    }
        
     // Here goes your checkbox column
     grid.addComponentColumn(item -> {
       // Create the checkbox 
     }).setHeader("<the header>");

    grid.setItems(entries.subList(1, entries.size()));

Adding Checkboxes to Vaadin Grids

1 Answers1