Skip to main content


Optional. Describes the configuration of cols/rows spans

spans?: object[];


Each object in the spans array contains the following properties:

row(string|number) mandatory, the id of a row
column(string|number) mandatory, the id of a column
rowspan(number) optional, the number of rows in a span
colspan(number) optional, the number of columns in a span
text(string|number) optional, the text in a spanned row/column
css(string) optional, the name of the CSS class that will be applied to a span


const treegrid = new dhx.TreeGrid("treegrid_container", {
columns: [
// columns config
spans: [
{row:"0", column:"a", rowspan:5 },
{row:"0", column:"b", rowspan:9, text:"<h2>Some content here</h2>"},
{row:"0", column:"c", colspan:2, text:"Some content"},
{row:"10", column:"a", colspan:4, text:"Some header", css:"myCustomColspan"}
data: dataset

Related sample: TreeGrid. Span cells