ZK 5: Frozen Column, In-place Editing and Rowspan

From Documentation
DocumentationSmall Talks2009SeptemberZK 5: Frozen Column, In-place Editing and Rowspan
ZK 5: Frozen Column, In-place Editing and Rowspan

Author
Jumper Chen, Engineer, Potix Corporation
Date
September 10, 2009
Version
ZK 5.0.0 and above

Introduction

Today, we're really pleased to launch several new ZK 5 features, including Frozen Column, In-place-editing and Rowspan within a grid. These features can enhance the usage of ZK to establish a flexible grid table to let the user modify and navigate the data quickly and easily, like a spreadsheet.

See Also

Live Demo

This is an annual report like a spreadsheet.

Features Overview

Frozen Columns

In ZK5, both components grid and listbox can use frozen columns.

For example.

<grid>
	<frozen style="background: #dfded8" columns="3">
		...
	</frozen>
</grid>

In the above example, we add a new component called Frozen to freeze columns within Grids and Listboxs. The Frozen component can have any child component.

In-place Editing

In ZK5, all input elements can have the in-place-editing functionality, like the combobox, textbox, datebox, and so on.

For example,

<textbox inplace="true"/>
<combobox inplace="true"/>
<datebox inplace="true"/>

The inplace property is used to enable or disable the in-place-editing function for the input element.

Rowspan

In ZK5, we have introduced a new component named Cell which can be embedded into a Grid or Box (Hbox and Vbox) to fully control the layout and the style, in the same manner as we demonstrated in the demo above.

You can now use the rowspan or the colspan property to layout your Grid, for example a content cell can now cross over multiple rows.

<row>
	<cell sclass="years" rowspan="12">
		...
	</cell>
</row>

Download

The demo could be downloaded here.

Summary

In this article, we demonstrated how to combine the three new features within the Grid component to improve the user experience, layout and navigation of your applications. Furthermore, in the upcoming ZK5 release, we will endeavour to make Zk even better and faster than it already is!



Copyright © Jumper Chen. This article is licensed under GNU Free Documentation License.