Client Attribute"
| Line 22: | Line 22: | ||
| + | If the attribute contains colon or other special characters, you can use the <code>attribute</code> element as follows. | ||
| + | |||
| + | <source lang="xml"> | ||
| + | <div xmlns:ca="client/attribute"> | ||
| + | <attribute ca:name="ns:whatever"> | ||
| + | whatever_value_you_want | ||
| + | </attribute> | ||
| + | </div> | ||
| + | </source> | ||
| + | |||
| + | == Tablet Device == | ||
| + | |||
| + | ZK EE only | ||
Each layout region in borderlayout can support to close and open the region area by user's swipe on the edge of the region with client/attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Borderlayout#SwipeEvent_Support|ZK Component Reference Tablet Devices: Borderlayout]].</ref>. | Each layout region in borderlayout can support to close and open the region area by user's swipe on the edge of the region with client/attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Borderlayout#SwipeEvent_Support|ZK Component Reference Tablet Devices: Borderlayout]].</ref>. | ||
| − | |||
<source lang="xml"> | <source lang="xml"> | ||
<borderlayout xmlns:ca="client/attribute" ca:data-swipeable="true"> | <borderlayout xmlns:ca="client/attribute" ca:data-swipeable="true"> | ||
| Line 33: | Line 45: | ||
Tabbox support to switch the tab by user swipe on the edge of content with client attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Tabbox#SwipeEvent_Support|ZK Component Reference Tablet Devices: Tabbox]].</ref>. | Tabbox support to switch the tab by user swipe on the edge of content with client attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Tabbox#SwipeEvent_Support|ZK Component Reference Tablet Devices: Tabbox]].</ref>. | ||
| − | |||
<source lang="xml"> | <source lang="xml"> | ||
<tabbox xmlns:ca="client/attribute" ca:data-swipeable="true"> | <tabbox xmlns:ca="client/attribute" ca:data-swipeable="true"> | ||
| Line 42: | Line 53: | ||
Within Tree, Grid, and Listbox, Paging can support to navigate previous page or next page by user swipe on the edge of content with client attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Paging#SwipeEvent_Support|ZK Component Reference Tablet Devices: Paging]].</ref>. | Within Tree, Grid, and Listbox, Paging can support to navigate previous page or next page by user swipe on the edge of content with client attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Paging#SwipeEvent_Support|ZK Component Reference Tablet Devices: Paging]].</ref>. | ||
| − | |||
| − | |||
<source lang="xml"> | <source lang="xml"> | ||
<listbox mold="paging" pageSize="5" xmlns:ca="client/attribute" ca:data-swipeable="true"></listbox> | <listbox mold="paging" pageSize="5" xmlns:ca="client/attribute" ca:data-swipeable="true"></listbox> | ||
| Line 50: | Line 59: | ||
Calendar can support to switch the view by user swipe on the content with client/attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Calendar#Friendly_Scrolling_Support|ZK Component Reference Tablet Devices: Calendar]].</ref>. | Calendar can support to switch the view by user swipe on the content with client/attribute<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Calendar#Friendly_Scrolling_Support|ZK Component Reference Tablet Devices: Calendar]].</ref>. | ||
| + | <source lang="xml"> | ||
| + | <calendar xmlns:ca="client/attribute" ca:data-swipeable="true" /> | ||
| + | </source> | ||
| − | + | ||
| + | When user swipe on the content of Listbox, Grid, Tree, the friendly scrollbar will appear. To disable the friendly scrollbar, please use the following setting<ref>For more information, please refer to [[ZK Component Reference/Tablet Devices/UI Enhancements/Listbox#Friendly_Scrolling_Support|ZK Component Reference Tablet Devices: Listbox]], [[ZK Component Reference/Tablet Devices/UI Enhancements/Grid#Friendly_Scrolling_Support|ZK Component Reference Tablet Devices: Grid]], [[ZK Component Reference/Tablet Devices/UI Enhancements/Tree#Friendly_Scrolling_Support|ZK Component Reference Tablet Devices: Tree]].</ref>. | ||
<source lang="xml"> | <source lang="xml"> | ||
| − | < | + | <listbox xmlns:a="client/attribute" a:data-scrollable="false"/> |
</source> | </source> | ||
| − | |||
| + | To prevent conflict with 'next' and 'previous' button on virtual keyboard on iPad. | ||
| + | Only make the modal window slide back by appling data-fixScrollPosition attribute on input element. | ||
<source lang="xml"> | <source lang="xml"> | ||
| − | < | + | <textbox xmlns:ca="client/attribute" ca:data-fixScrollPosition="true"></textbox> |
| − | |||
| − | |||
| − | |||
| − | </ | ||
</source> | </source> | ||
Revision as of 02:56, 26 March 2014
Name: client attribute Namespace: http://www.zkoss.org/2005/zk/client/attribute Namespace shortcut: client/attribute Java: LanguageDefinition.CLIENT_ATTRIBUTE_NAMESPACE
It is the reserved namespace for specifying client-side DOM attributes. Unlike the client namespace, which assigns something to widgets, the client/attribute namespace assigns additional DOM attributes to the DOM tree directly at the client.
Notice that if the widget's DOM output (Widget.redraw(Array)) also has the same DOM attribute, both of them will be generated and it is technically not legal. Thus, you shall prevent the DOM attributes that widget might output.
For example, suppose you want to listen to the onload event, and then you can do as follows[1].
<iframe src="http://www.google.com" width="100%" height="300px"
xmlns:ca="client/attribute"
ca:onload="do_whater_you_want()"/>
If the attribute contains colon or other special characters, you can use the attribute element as follows.
<div xmlns:ca="client/attribute">
<attribute ca:name="ns:whatever">
whatever_value_you_want
</attribute>
</div>
Tablet Device
ZK EE only
Each layout region in borderlayout can support to close and open the region area by user's swipe on the edge of the region with client/attribute[2].
<borderlayout xmlns:ca="client/attribute" ca:data-swipeable="true">
<!-- omitted -->
</borderlayout>
Tabbox support to switch the tab by user swipe on the edge of content with client attribute[3].
<tabbox xmlns:ca="client/attribute" ca:data-swipeable="true">
<!-- omitted -->
</tabbox>
Within Tree, Grid, and Listbox, Paging can support to navigate previous page or next page by user swipe on the edge of content with client attribute[4].
<listbox mold="paging" pageSize="5" xmlns:ca="client/attribute" ca:data-swipeable="true"></listbox>
Calendar can support to switch the view by user swipe on the content with client/attribute[5].
<calendar xmlns:ca="client/attribute" ca:data-swipeable="true" />
When user swipe on the content of Listbox, Grid, Tree, the friendly scrollbar will appear. To disable the friendly scrollbar, please use the following setting[6].
<listbox xmlns:a="client/attribute" a:data-scrollable="false"/>
To prevent conflict with 'next' and 'previous' button on virtual keyboard on iPad.
Only make the modal window slide back by appling data-fixScrollPosition attribute on input element.
<textbox xmlns:ca="client/attribute" ca:data-fixScrollPosition="true"></textbox>
The other use of the client-attribute namespace is to specify attributes that are available only to certain browsers, such as accessibility and Section 508.
- ↑ For more information, please refer to ZK Component Reference: iframe.
- ↑ For more information, please refer to ZK Component Reference Tablet Devices: Borderlayout.
- ↑ For more information, please refer to ZK Component Reference Tablet Devices: Tabbox.
- ↑ For more information, please refer to ZK Component Reference Tablet Devices: Paging.
- ↑ For more information, please refer to ZK Component Reference Tablet Devices: Calendar.
- ↑ For more information, please refer to ZK Component Reference Tablet Devices: Listbox, ZK Component Reference Tablet Devices: Grid, ZK Component Reference Tablet Devices: Tree.
Version History
| Version | Date | Content |
|---|---|---|
| 5.0.3 | July 2010 | The client-attribute namespace was introduced. |