The native Namespace"

From Documentation
Line 52: Line 52:
 
The rule of thumb is to use [[ZK Developer's Reference/UI Patterns/HTML Tags/The native Namespace|the native namespace]] if possible. If you need to change the content dynamically, you might consider [[ZK Developer's Reference/UI Patterns/HTML Tags/The html Component|the html component]] first. If still not applicable, use [[ZUML Reference/ZUML/Languages/XHTML|the XHTML component set]].
 
The rule of thumb is to use [[ZK Developer's Reference/UI Patterns/HTML Tags/The native Namespace|the native namespace]] if possible. If you need to change the content dynamically, you might consider [[ZK Developer's Reference/UI Patterns/HTML Tags/The html Component|the html component]] first. If still not applicable, use [[ZUML Reference/ZUML/Languages/XHTML|the XHTML component set]].
  
= Output Another Namespace with the Native Namespace =
+
= Output Tags with Another Namespace=
If you want to generate another namespace to the output, you can use another format as the URI of the Native namespace:
+
 
 +
If the HTML tag you want to output requires a XML namespace (such as XAML), you can use the following format to specify the URI of the XML namespace you want to output:
  
 
<source lang="xml" >
 
<source lang="xml" >
native:''URI-of-another-namespace''
+
<element xmlns="native:URI-of-another-namespace">
 
</source>
 
</source>
 
   
 
   
For example, if you want to output the XAML tags directly to the client, you can specify <nowiki>native:http://schemas.microsoft.com/client/2007</nowiki> as follows.
+
For example, if you want to output the XAML tags directly to the client, you can specify XAML's XML namespace as follows.
  
 
<source lang="xml" >
 
<source lang="xml" >
<zk>
+
<div>
 
<Canvas xmlns="native:http://schemas.microsoft.com/client/2007">
 
<Canvas xmlns="native:http://schemas.microsoft.com/client/2007">
 
  <TextBlock>Hello World!</TextBlock>
 
  <TextBlock>Hello World!</TextBlock>
 
</Canvas>
 
</Canvas>
</zk>
+
</div>
 
</source>
 
</source>
 
   
 
   
Then, the client will receive the following<ref>The real HTML output of window depends on its implementation. Here is only a simplified version.</ref>:
+
Then, the result DOM structure will be similar to the following<ref>The real DOM structure of a component (div in this example) depends on its implementation. Here is only a simplified version.</ref>:
  
 
<source lang="xml" >
 
<source lang="xml" >
<div z.au="/ZKTester/zkau" z.zidsp="page" style="width: 100%; height: 100%;" z.dtid="gk68" id="z_k6_0" class="zk">
+
<div id="zk_uuid">
 
     <canvas xmlns="http://schemas.microsoft.com/client/2007">
 
     <canvas xmlns="http://schemas.microsoft.com/client/2007">
 
           <textblock>Hello World!</textblock>
 
           <textblock>Hello World!</textblock>
Line 79: Line 80:
 
</source>
 
</source>
  
'''Notes'''
+
<blockquote>
 +
----
 
<references/>
 
<references/>
 +
</blockquote>
  
 
=Version History=
 
=Version History=

Revision as of 01:59, 11 November 2010


The native Namespace


Overview

With the native namespace, a XML element in a ZUML document will be interpreted as a native tag that shall be sent to the browser directly, rather than becoming a ZK component.

For example,

 <n:ul xmlns:n="http://www.zkoss.org/2005/zk/native">
     <n:li>
     <textbox/>
     </n:li>
     <n:li>
     <textbox/>
     </n:li>
 </n:ul>

will attach the following HTML tags to the browser's DOM tree:

 <ul>
     <li>
     <input id="z_a3_2"/>
     </li>
     <li>
     <input id="z_a3_5"/>
     </li>
 </ul

where <input> is the HTML tag(s) generated by the textbox component. Unlike textbox in the example above, ZK Loader doesn't really create a component for each of ul and li.[1] Rather, they are sent to the client directly. Of course, they must be recognizable by the client. For a HTML browser, they must be the valid HTML tags.


  1. ZK ZK actually creates a special component to represent as many XML elements with the native namespace as possible.

Pros and Cons

The XML elements associated with the native namespace will be considered as tags that the client accepts, and they are sent directly to the client to display. They are not ZK components, and they don't have the counterpart (widget) at the client. The advantage is the better performance in term of both memory and processing time.

However, the disadvantage is you cannot access or change them dynamically. For example, the following code snippet is incorrect, since there is no component called x.

 <n:ul id="x" xmlns:n="http://www.zkoss.org/2005/zk/native"/>
 <button label="add" onClick="new Li().setParent(x)"/>

If you want to change them dynamically, you could use the components from the XHTML component set as described in the following section.

The rule of thumb is to use the native namespace if possible. If you need to change the content dynamically, you might consider the html component first. If still not applicable, use the XHTML component set.

Output Tags with Another Namespace

If the HTML tag you want to output requires a XML namespace (such as XAML), you can use the following format to specify the URI of the XML namespace you want to output:

<element xmlns="native:URI-of-another-namespace">

For example, if you want to output the XAML tags directly to the client, you can specify XAML's XML namespace as follows.

<div>
	<Canvas xmlns="native:http://schemas.microsoft.com/client/2007">
	  <TextBlock>Hello World!</TextBlock>
	</Canvas>
</div>

Then, the result DOM structure will be similar to the following[1]:

<div id="zk_uuid">
     <canvas xmlns="http://schemas.microsoft.com/client/2007">
          <textblock>Hello World!</textblock>
     </canvas>
</div>

  1. The real DOM structure of a component (div in this example) depends on its implementation. Here is only a simplified version.

Version History

Last Update : 2010/11/11

Version Date Content
     



Last Update : 2010/11/11

Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License.