How can I add a button in a column in a data grid?

In a data grid I show products that can be bought in a web shop. Beside each product I want a button 'Add to shopping cart'. How can I accomplish this?
3 answers

You can't add buttons to a datagrid, but you can use a template grid for this purpose.


As has been mentioned, the TemplateGrid can be used to include buttons (which trigger a MicroFlow) as well as thumbnails or full images of uploaded, well, images.

There are however, several differences between DataGrid and TemplateGrid which you should take into account before selecting one or the other.

The DataGrid is based on rows of objects with attributes rendered into fixed columns. An Excel-like view if you want. The fixed position of the columns allows us to do things such as have column headers, which can be clicked to alter the set sorting. Or present aggregate cells underneath the columns (totals, counts, etc). Or in-line editing of the data in the grid.

The TemplateGrid, on the other hand, has no notion of 'columns'. Each attribute of an object is rendered into an arbitrary form (which you design in the Modeler) and the forms themselves are positioned in an even x-by-y grid.

Paging, searching, selection, context parameters, buttons in the control bar, etc work exactly the same way they do in the DataGrid (because they use the same engines), but the rendering is different and there is no attribute-based column structure left. Therefore the TemplateGrid doesn't have column headers to click on, nor the ability to render aggregate data in columns (because there is no sane way to determine the position to render this data in the view).

In-line editing is also problematic in TemplateGrids (and therefore not available). In a DataGrid the structure is fixed and shifting editing focus goes left-to-right until the end of the row, in which case it goes down a row to the first editable cell and goes left-to right again. (Unless you happen to use a right-to-left interface, in which case this is reversed).

On the other hand, using TemplateGrid you can discard the row-based rendering of values and model a form to render each object in, which you can place in an x-by-y grid you specify. In the form you can use buttons, images, etc and generally provide a highly customized view of each object.


Not really an answer to your question but if you want to take a look at a good example of a webshop made on template grid functionality you have to see the Eurofiber Webshop. You can contact Floor van Gageldonk for this.