Header of the datatable can be fixed to keep it in viewport during scroll.
DocumentationId | Year | Brand | Color |
---|---|---|---|
01fff1e0 | 1979 | Volvo | Green |
d44acf82 | 2000 | Volvo | Yellow |
b073ff02 | 1986 | Mercedes | Orange |
c2db71e0 | 1966 | Volvo | Orange |
9b2443af | 2009 | BMW | Blue |
3a769516 | 2006 | Volkswagen | Red |
2e1af96f | 2007 | Volkswagen | Blue |
91626dda | 1982 | Mercedes | Blue |
dc158b88 | 1979 | BMW | Green |
7235e917 | 2009 | Honda | Yellow |
3176c894 | 1988 | Volvo | Red |
ddef60d0 | 1991 | Jaguar | Blue |
f6731399 | 1990 | Volvo | Orange |
4607ddeb | 2008 | Volkswagen | Maroon |
a09f532c | 1970 | Jaguar | Red |
f448fda3 | 1995 | Renault | Orange |
2d2da48d | 1975 | Audi | Red |
c7e80ca5 | 1983 | Volkswagen | Maroon |
a6fb4aee | 2002 | Mercedes | Red |
b71fac1a | 1964 | Jaguar | Silver |
80f0b30a | 1979 | Volkswagen | Orange |
90ebb8be | 1978 | Mercedes | Silver |
3b40ae55 | 2008 | BMW | White |
0d8e2b94 | 1997 | Mercedes | Maroon |
18b49509 | 1988 | BMW | Maroon |
2b3fdb7b | 1993 | Ford | Brown |
cd1c5b04 | 1979 | Volvo | Yellow |
6e4554ee | 1960 | Volkswagen | Green |
9dcb8187 | 1999 | Honda | Maroon |
734bf3d2 | 1975 | Renault | White |
db06023e | 1980 | Fiat | White |
af2327c4 | 1999 | Fiat | Silver |
c44dcf41 | 1990 | Volvo | Silver |
77669fc6 | 1987 | Audi | Blue |
a437e5bd | 1983 | Jaguar | Yellow |
132c80eb | 2002 | BMW | Blue |
dbad85ed | 1973 | Jaguar | Black |
f74fc276 | 1973 | Fiat | Silver |
d96edaa8 | 1999 | Volkswagen | Orange |
3fc5a802 | 1964 | Renault | White |
d68769af | 1997 | Mercedes | White |
3f7aca62 | 1994 | Audi | Orange |
d43fd21d | 1995 | Mercedes | Maroon |
112999ad | 1977 | Fiat | Yellow |
f999b7c6 | 1997 | Ford | Yellow |
76a11888 | 1975 | Audi | White |
62d24d3e | 1988 | Volkswagen | Orange |
986804e0 | 2005 | Ford | Blue |
ce30d4b2 | 1978 | Ford | Yellow |
bdbb81b3 | 2006 | Volvo | Brown |
<p:dataTable var="car" value="#{dtStickyView.cars}" stickyHeader="true" stickyTopAt=".layout-topbar"> <p:column headerText="Id"> <h:outputText value="#{car.id}" /> </p:column> <p:column headerText="Year"> <h:outputText value="#{car.year}" /> </p:column> <p:column headerText="Brand"> <h:outputText value="#{car.brand}" /> </p:column> <p:column headerText="Color"> <h:outputText value="#{car.color}" /> </p:column> </p:dataTable>
@Named("dtStickyView") @RequestScoped public class StickyView implements Serializable { private List<Car> cars; @Inject private CarService service; @PostConstruct public void init() { cars = service.createCars(50); } public List<Car> getCars() { return cars; } public void setService(CarService service) { this.service = service; } }
@Named @ApplicationScoped public class CarService { private final static String[] colors; private final static String[] brands; static { colors = new String[10]; colors[0] = "Black"; colors[1] = "White"; colors[2] = "Green"; colors[3] = "Red"; colors[4] = "Blue"; colors[5] = "Orange"; colors[6] = "Silver"; colors[7] = "Yellow"; colors[8] = "Brown"; colors[9] = "Maroon"; brands = new String[10]; brands[0] = "BMW"; brands[1] = "Mercedes"; brands[2] = "Volvo"; brands[3] = "Audi"; brands[4] = "Renault"; brands[5] = "Fiat"; brands[6] = "Volkswagen"; brands[7] = "Honda"; brands[8] = "Jaguar"; brands[9] = "Ford"; } public List<Car> createCars(int size) { List<Car> list = new ArrayList<Car>(); for(int i = 0 ; i < size ; i++) { list.add(new Car(getRandomId(), getRandomBrand(), getRandomYear(), getRandomColor(), getRandomPrice(), getRandomSoldState())); } return list; } private String getRandomId() { return UUID.randomUUID().toString().substring(0, 8); } private int getRandomYear() { return (int) (Math.random() * 50 + 1960); } private String getRandomColor() { return colors[(int) (Math.random() * 10)]; } private String getRandomBrand() { return brands[(int) (Math.random() * 10)]; } private int getRandomPrice() { return (int) (Math.random() * 100000); } private boolean getRandomSoldState() { return (Math.random() > 0.5) ? true: false; } public List<String> getColors() { return Arrays.asList(colors); } public List<String> getBrands() { return Arrays.asList(brands); } }