Místem, kde se setkává aplikační obsah s obecnými možnostmi komponent COMEX jsou stránky. Zde dostávají konkrétní funkční formu a tvoří použitelné uživatelské rozhraní. Jednoduchá stránka sloužící pro nalezení, zobrazení či přidání kontaktu může mít následujícídefinici:
<cxd:definition xmlns:cxd="http://www.flexideo.com/comex/definition">
<cxd:page id="1023" langs="mixed">
<cxd:header>
<cxd:lang descr="Přehled pro dohledání požadovaného kontaktu dle jména nebo čísla." code="cs" label="Kontakty"/>
<cxd:general icon="contact.png" name="kontakty"/>
</cxd:header>
<cxd:frame>
<cxd:with-param name="tile" content="3"/>
<cxd:component source="comex.table.form:1023.filter">
<cxd:connection target="comex.table.data:1023.grid" event="submit"/>
</cxd:component>
<cxd:component source="comex.table.data:1023.grid">
<cxd:connection target="comex.table.data:1023.grid" event="onselect"/>
</cxd:component>
<cxd:component source="comex.special.action:common.button">
<cxd:with-param name="label" content="Nový kontakt"/>
<cxd:connection target="comex.document.form:kontact.standard" event="onclick"/>
</cxd:component>
</cxd:frame>
<cxd:frame>
<cxd:with-param name="tile" content="3"/>
<cxd:component source="comex.document.preview:kontakt.inpage"/>
</cxd:frame>
</cxd:page>
</cxd:definition>
Tato stránka je dělena na dvě části zborazované vedle sebe, pokud je dostatek místa. V první části (rámci) je uvdena samotná tabulka a pod ní tlačítko pro přidání kontaktu. V další části je pak možnost příméhozobrazení. Obě části jsou pak propojeny uzlem connection, který se stará o přenos události výběru položky pro její zobrazení v komponentě náhledu.
Takto může vypadat jiná jednoduchá definice stránky určená pro vyhledávání kontaktů pomocípřehledu s id 1234:
<cxd:definition xmlns:cxd="http://www.flexideo.com/comex/definition">
<cxd:page id="1234" langs="mixed">
<cxd:header>
<cxd:general icon="contact.png" name="kontakty"/>
<cxd:lang descr="Přehled firemních kontaktů" code="cs" label="Kontakty"/>
<cxd:lang code="en" label="Contacts" descr="Table of company contacts."/>
</cxd:header>
<cxd:frame>
<cxd:component source="comex.table.form:1234.filter">
<cxd:connection target="comex.table.data:8871.grid" event="submit" operator="object"/>
</cxd:component>
<cxd:component source="comex.table.data:1234.grid">
<cxd:with-param data-type="boolean" content="true" name="visualMerge"/>
<cxd:with-param data-type="boolean" content="true" name="hiddenDescription"/>
<cxd:with-param data-type="boolean" content="true" name="hiddenHeader"/>
</cxd:component>
</cxd:frame>
</cxd:page>
</cxd:definition>
Všimněte si, že
id stránky má stejnou hodnotu jako id použitých dvou komponent z třídy table. Znamená to jedinouvěc, že jde o "domovskou stránku" této tabulky. Tu je možné vyvolat odkazem https://muj.server.cz/comex/?id=1234. Nic ale nebrání tomu využívat komponentu tabulky 1234 i na jiných stránkách, nebo na domovskou stránku 1234 přidat i další komponenty nebo stávající upravit. Je možné, dát na domovskoustránku i zcela jiné komponenty, ale smysl to příliš nedává.
Dále si u definice stránky můžeme všimnout, že její jazyková nastavení v atributu
langs v kmenovém potomku page jsou s hodnotou mixed. Stránky jsou většinou definovány v různých jazycích vrámci jedné definice, ale není to nezbytné (viz.
definice jazykových mutací.
V obsahu definice je jako první uzel
cxd:header, který udává základní informace o stránce a to buď vč. jazykověorientovaných popisů v uzlech lang nebo bez nich a to v závislosti na již zmíněných jazykových nastaveních v atributu langs. Více o hlavičkách viz. definiční typ
headerElmType.
Obsah vlastnístránky pak vždy tvoří jeden nebo více rámců určených uzly
cxd:frame. Zajišťují responzivitu stránky a její rozložení. Jedině rámce mohou být striktně pod sebou nebo mohou být do sebe v nořovány. Samotné komponenty pak pouze s ohledem na svou velikost leží na řádku uvnitřněkterého z rámečků. Možnosti rámečků viz. popis definice
uzlu cxd:frame.
Teprve v rámečcích jsou umístěny jednotlivé komponenty pomocí uzlů
cxd:component. Tyto komponenty jsouurčeny klíčovým atributem source, který udává její druh odkazem na patřičný
modifikátor a aplikační instanci určovanou u tabulek celočíselným id (viz.
struktura odkazů.
Popis všech možností definice viz. popis uzlu
page.