XUL:Tree: Difference between revisions

XUL:Tree (view source)

1,262 bytes added , 16 February 2009

4

edits

@@ Line 179: / Line 179: @@
 <pre>
+<?xml version="1.0" encoding="UTF-8"?>
+<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+	title="Sample JSON-Based Tree" sizemode="normal"
+	onload="new SampleState();" width="640px" height="480px">
+	<script type="text/javascript" src="SimpleTreeModel.js"></script>
+	<script type="text/javascript">
+		function SampleState(){
+			//reference for the tree
+			var tContacts = document.getElementById("contacts");
+			//some ordinary data
+			var data = [
+				{"sender":"joe@somewhere.com","subject":"Top secret plans"},
+				{"sender":"mel@whereever.com","subject":"Let's do lunch"}
+			];
+			//a basic columnModel
+			var cModel = [
+				function(data){
+					return data.sender;
+				},
+				function(data){
+					return data.subject;
+				}
+			];
+			//our instance Model
+			var model = new SimpleTreeModel({
+				"tree":tContacts,
+				"model":data,
+				"columnModel":cModel
+			});
+			//let's draw the tree
+			model.update();
+		}
+	</script>
+	<tree flex="1" hidecolumnpicker="true"
+		seltype="single" id="contacts">
+		<treecols>
+			<treecol id="sender" label="Sender" flex="1" />
+			<treecol id="subject" label="Subject" flex="2" />
+		</treecols>
+	</tree>
+</window>
 </pre>