menu da árvore jQuery EasyUI - criar uma malha de árvore complexa
grade Tree (TreeGrid) pode parecer complexo e multi-coluna de planilha com o espaço de dados é limitada. Este tutorial demonstra como particionar dados da tabela são organizados em uma grade e multi-linha cabeçalhos, a fim de organizar os dados comuns.
Criar grade de árvore (TreeGrid)
<Tabela title = class "TreeGrid Complex" = "easyui-TreeGrid" style = "width: 550px; height: 250px" url = "Dados / treegrid2_data.json" rownumbers = "true" ShowFooter = "true" IDField = "id" treeField = "região"> <Thead congelada = "true"> <Tr> <Th campo = "região" width = "150"> Região </ th> </ Tr> </ Thead> <Thead> <Tr> <Th colspan = "4"> 2009 </ th> <Th colspan = "4"> 2010 </ th> </ Tr> <Tr> <Th campo = "f1" width = "50" align = "right"> 1º qRT. </ Th> <Th field = "F2" width = "50" align = "right"> qRT 2ª. </ Th> <Th campo = "F3" width = "50" align = "right"> qRT 3ST. </ Th> <Th campo = "f4" width = "50" align = "right"> qRT 4st. </ Th> <Th campo = "f5" width = "50" align = "right"> 1º qRT. </ Th> <Th campo = "f6" width = "50" align = "right"> qRT 2ª. </ Th> <Th campo = "F7" width = "50" align = "right"> qRT 3ST. </ Th> <Th campo = "f8" width = "50" align = "right"> qRT 4st. </ Th> </ Tr> </ Thead> </ Table>
Como você pode ver, a grade de árvore (TreeGrid) usar e grade de dados (Datagrid) o mesmo. Por favor, use a propriedade "congelado" para definir colunas congeladas, coluna "colspan" e de propriedade "rowspan" para definir um cabeçalho de multi-linha.