Wiki  |   Blog  |   Sitemap  |   Search  
Home
JavaScript UI FrameworkExamplesUI Languages (SVG, XUL..)XUL examplesData Views

listbox (listview):

Source code

<script type="application/ample+xml" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <xul:listbox height="200"> <xul:listhead> <xul:listheader minwidth="30" label="id"/> <xul:listheader width="100" minwidth="100" label="Name"/> <xul:listheader minwidth="50" label="column2"/> <xul:listheader minwidth="200" label="column2"/> </xul:listhead> <xul:listbody> <xul:listitem class="test"> <xul:listcell label="1"></xul:listcell> <xul:listcell label="George"/> <xul:listcell label="House Painter"/> <xul:listcell label="USA"/> </xul:listitem> <xul:listitem class="test2"> <xul:listcell label="2"></xul:listcell> <xul:listcell label="Mary Ellen"/> <xul:listcell label="Candle Maker"/> <xul:listcell label="Java"/> </xul:listitem> <xul:listitem class="test3"> <xul:listcell label="3"></xul:listcell> <xul:listcell label="Roger"/> <xul:listcell label="Swashbuckler"/> <xul:listcell label="Great Britain"/> </xul:listitem> <xul:listitem class="test4"> <xul:listcell label="4"></xul:listcell> <xul:listcell label="Sam"/> <xul:listcell label="Browm"/> <xul:listcell label="Falkland islands"/> </xul:listitem> <xul:listitem> <xul:listcell label="5"></xul:listcell> <xul:listcell label="Tom"/> <xul:listcell label="Jones"/> <xul:listcell label="Oceania"/> </xul:listitem> <xul:listitem> <xul:listcell label="6"></xul:listcell> <xul:listcell label="Pink"/> <xul:listcell label="Floyd"/> <xul:listcell label="Australia"/> </xul:listitem> </xul:listbody> </xul:listbox> <br /> disabled: <xul:listbox height="200" disabled="true"> <xul:listhead> <xul:listheader minwidth="30" width="30" label="id"/> <xul:listheader minwidth="200" label="Name"/> <xul:listheader minwidth="200" label="column2"/> <xul:listheader minwidth="200" width="200" label="column2"/> </xul:listhead> <xul:listbody> <xul:listitem class="test"> <xul:listcell label="1"></xul:listcell> <xul:listcell label="George"/> <xul:listcell label="House Painter"/> <xul:listcell label="USA"/> </xul:listitem> <xul:listitem class="test2"> <xul:listcell label="2"></xul:listcell> <xul:listcell label="Mary Ellen"/> <xul:listcell label="Candle Maker"/> <xul:listcell label="Java"/> </xul:listitem> <xul:listitem class="test3"> <xul:listcell label="3"></xul:listcell> <xul:listcell label="Roger"/> <xul:listcell label="Swashbuckler"/> <xul:listcell label="Great Britain"/> </xul:listitem> <xul:listitem class="test4"> <xul:listcell label="4"></xul:listcell> <xul:listcell label="Sam"/> <xul:listcell label="Browm"/> <xul:listcell label="Falkland islands"/> </xul:listitem> <xul:listitem> <xul:listcell label="5"></xul:listcell> <xul:listcell label="Tom"/> <xul:listcell label="Jones"/> <xul:listcell label="Oceania"/> </xul:listitem> <xul:listitem> <xul:listcell label="6"></xul:listcell> <xul:listcell label="Pink"/> <xul:listcell label="Floyd"/> <xul:listcell label="Australia"/> </xul:listitem> </xul:listbody> </xul:listbox> </script>

tree (treeview):

Source code

<script type="application/ample+xml" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <xul:tree height="200" type="checkbox"> <xul:treecols> <xul:treecol id="firstname" minwidth="200" width="400" label="First Name" primary="true"/> <xul:treecol id="lastname" minwidth="500" label="Last Name"/> </xul:treecols> <xul:treebody> <xul:treechildren> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Guys"/> <xul:treecell label="Test"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Pink"/> <xul:treecell label="Floyd"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Guys"/> <xul:treecell label="Test"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Pink"/> <xul:treecell label="Floyd"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Guys"/> <xul:treecell label="Test"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Pink"/> <xul:treecell label="Floyd"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> </xul:treechildren> </xul:treebody> </xul:tree> <br /> disabled: <xul:tree height="200" type="checkbox" disabled="true"> <xul:treecols> <xul:treecol minwidth="200" label="First Name" primary="true"/> <xul:treecol minwidth="500" label="Last Name"/> </xul:treecols> <xul:treebody> <xul:treechildren> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Guys"/> <xul:treecell label="Test"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Pink"/> <xul:treecell label="Floyd"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Guys"/> <xul:treecell label="Test"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Pink"/> <xul:treecell label="Floyd"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Guys"/> <xul:treecell label="Test"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem open="true" container="true"> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> <xul:treechildren> <xul:treeitem> <xul:treerow> <xul:treecell label="Bob"/> <xul:treecell label="Carpenter"/> </xul:treerow> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Jerry"/> <xul:treecell label="Hodge"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> </xul:treechildren> </xul:treeitem> <xul:treeitem> <xul:treerow> <xul:treecell label="Pink"/> <xul:treecell label="Floyd"/> </xul:treerow> </xul:treeitem> </xul:treechildren> </xul:treeitem> </xul:treechildren> </xul:treebody> </xul:tree> </script>