ExtJS Table Layout

Ext.onready (function () {
var _panel = new Ext.panel ({
Title: "Personnel Information",
RenderTo:Ext.getBody (),
WIDTH:500,
HEIGHT:200,
Layout: "Table",
Layoutconfig: {
Columns:3
},
Items:[{title: "Child element 1", HTML: "This is the content of child element 1", rowspan:2,height:100},
{title: "Child element 2", HTML: "This is the content of child element 2", Colspan:2},
{title: "Child element 3", HTML: "This is the contents of child element 3"},
{title: "Child element 4", HTML: "This is the contents of child element 4"}
]
}
);

A table layout is defined by the class Ext.layout.TableLayout, and classes are used in the table in HTML to merge rows or columns.
Layoutconfig uses columns to specify that the parent container is divided into 3 columns,
RowSpan the number of merged rows.
Colspan the number of merged columns.
Second, application examples