showGroupHeader

If set to true shows the grid group header where all groups are listed.

$("#grid").shieldGrid({
    dataSource: {
        schema: {
            fields: {
                ProductID: { path: "ProductID", type: Number },
                UnitPrice: { path: "UnitPrice", type: Number },
                UnitsInStock: { path: "UnitsInStock", type: String },
                            
                Discontinued: { path: "Discontinued", type: Boolean }
            }
        },
        data: products,
        group: [
            { field: "ProductID", order: "asc", aggregate: [{ field: "ProductID", aggregate: "count", type: Number }, { field: "UnitPrice", aggregate: "count", type: Number }] },
            { field: "Discontinued", order: "asc", aggregate: [{ field: "ProductID", aggregate: "count", type: Number }] }
        ]
    },
    grouping: {
        showGroupHeader: true,
        allowDragToGroup: true,
        message: "Drag a column header here to group by a column"
    },
    columns: [
    { field: "ProductID", title: "ProductID", width: "330px", groupFooterTemplate: "Count: {count}" },
    { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "230px", groupFooterTemplate: "Count: {count}" },
    { field: "UnitsInStock", title: "Units In Stock", width: "230px" },
    { field: "Discontinued", width: "230px", groupFooterTemplate: "Count: {count}" }
    ]
});

Live example of the grid group header item can be found here: grouping