Putting it all Together"

Revision as of 02:07, 14 July 2010

The widget implementation must be placed in an independent JavaScript file. The file must be placed under the directory, /web/js/package-path, in the Java class path. Since the widget name is SimpleLabel and the package name is com.foo, the file path is /web/js/com/foo/SimpleLabel.js

zk.$package('simplelabel');

com.foo.SimpleLabel = zk.$extends(zk.Widget, { _value : , // default value

getValue : function() { return this._value; },

setValue : function(value) { if (this._value != value) { this._value = value; if (this.desktop) this.$n().innerHTML = zUtl.encodeXML(value); } }

}); Having set-up the ability to handle states we now need to create the component view. This can be accomplished using two methods.

Last Update : 2010/07/14

Anonymous

Putting it all Together"

Namespaces

More

Page actions

Revision as of 02:07, 14 July 2010

@@ Line 1: / Line 1: @@
-The widget class must extend from <javadoc directory="jsdoc">zk.Widget</javadoc> or one of its derived classes. There are several skeletal implementations available. The skeletal implementations are shown in the image below.
+{{ZKComponentDevelopmentEssentialsPageHeader}}
-[[File:ZKComDevEss_widget_hierarchy.png]]
-For the purposes of this tutorial, we will use <javadoc directory="jsdoc">zk.Widget</javadoc>. Before we proceed, we need to decide the name of the widget class. Let’s assume <mp>com.foo.SimpleLabel</mp>.
+The widget implementation must be placed in an independent JavaScript file. The file must be placed under the directory, /web/js/package-path, in the Java class path. Since the widget name is SimpleLabel and the package name is com.foo, the file path is /web/js/com/foo/SimpleLabel.js
+zk.$package('simplelabel');
+com.foo.SimpleLabel = zk.$extends(zk.Widget, {
+	_value : '', // default value
+	getValue : function() {
+		return this._value;
+	},
+	setValue : function(value) {
+		if (this._value != value) {
+			this._value = value;
+			if (this.desktop)
+				this.$n().innerHTML = zUtl.encodeXML(value);
+		}
+	}
+});
+Having set-up the ability to handle states we now need to create the component view. This can be accomplished using two methods.
+{{ZKComponentDevelopmentEssentialsPageFooter}}