Is it possible to put the headings of a template grid or list view below the control bar just like the data grid? Not repeating for each row!

4
Hi All     Is there a way for me to put the headings below the control bar like in the data grid. If i use the data grid or data grid extension i cant show button according to their status. If i use a template grid as above the look and feel is not the same as the rest of my project and if u use the search and paging option it does not look that great.  Id there another tool i can use for this or would i have to create a new widget. Has anybody else run into the same problems?   Regards, Patrick   
asked
3 answers
12

It is at least not directly possible, but there are some Hacks to get the same Look and Feel.

One solution that I have applied more often now is to add the header WITHIN the templategrid items, and use css styling to only show theses headers for the first row in the templategrid.

Modeler:

how it looks

The main styling uses these two classes - you need to make some adjustments to match it to your actual styling.

* add the grid-inlineheader class to your grid

* add the grid-inlineheader-header class to the row containing the headers

* add the following to your custom css

.grid-inlineheader.mx-templategrid {
	.mx-templategrid-row {
		.grid-inlineheader-header {
			display: none;
		}
	}
	.mx-templategrid-row:first-child {
		.grid-inlineheader-header {
			display: inherit;
		}
	}
}

 

answered
2

It works great.

The same is possible in a listview with

// header in listview
.grid-inlineheader.mx-listview {
    .mx-listview-item {
        .grid-inlineheader-header {
            display: none;
        }
    }
    .mx-listview-item:first-child {
        .grid-inlineheader-header {
            display: inherit;
        }
    }
}

answered
1

Hi Mendix, is there an updated solution for this now or is there a new workaround?

answered