Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vaadin Grid Table : How to disable Sort Function and set the color of one column

I'm using Grid table in Vaadin for data representation. For that I'm trying to figure out the following two issues:

1.) How to disable the sort function in the Header of each column

2.) How to set the color of one column in a Grid table

like image 462
Hakan Kiyar Avatar asked Feb 24 '16 12:02

Hakan Kiyar


2 Answers

First of all, I find the Vaadin docs a good place to start looking for help. For the rest of the exercise, suppose we have a Grid with 3 simple columns c1, c2 & c3:

Grid grid = new Grid();
grid.addColumn("c1", String.class);
grid.addColumn("c2", String.class);
grid.addColumn("c3", String.class);



1.) How to disable the sort function in the Header of each column

Iterate through each column and set its sortable property to false:

for (Grid.Column column : grid.getColumns()) {
    column.setSortable(false);
}

Or just get that one column you want and set its sortable property:

grid.getColumn("c1").setSortable(false);



2.) How to set the color of one column in a Grid table

Similar to how it was done with the table, you need to define your CSS style in your theme:

@import "../valo/valo.scss";

@mixin mytheme {
  @include valo;
  // Insert your own theme rules here

  .v-grid-cell.green {
    background: #33BB00;
  }
}

And use a CellStyleGenerator to apply the style to your desired column:

grid.setCellStyleGenerator(new Grid.CellStyleGenerator() {
    @Override
    public String getStyle(Grid.CellReference cellReference) {
        if ("c1".equals(cellReference.getPropertyId())) {
            return "green";
        } else {
            return null;
        }
    }
});

Which should generate something along the lines of:

enter image description here

like image 87
Morfic Avatar answered Sep 20 '22 22:09

Morfic


Here is a small supplement to Morfic good answer:

1.) How to disable the sort function in the Header of each column

Grid asks the Container if a column is sortable (see appendColumn-method in Grid). If you want to disable sorting for all columns, you can override getSortableContainerPropertyIds in your Container and return an empty collection:

container = new BeanContainer<String, Dive>(Dive.class) {
            @Override
            public Collection<?> getSortableContainerPropertyIds() {
                LinkedList<Object> sortables = new LinkedList<Object>();
                return sortables;
            }
        };
like image 41
Sebastian S Avatar answered Sep 18 '22 22:09

Sebastian S