ZK8 Wizard Example - Part 2

Author
Robert Wenzel, Engineer, Potix Corporation

Date
July/August 2015

Version
ZK 8.0

Introduction

In the previous Part 1 LINK ME I created a wizard template together with a model. I showed its usage in a trivial case. This Part will focus on reusing the same wizard template in a different scenario with more complex steps. I'll go deeper into templating and reuse various parts of the UI.

I'll also highlight some optional features to give the example more of a real life feeling.

Order Wizard (a more complex example)

As an example I chose a classical Shopping basket and Checkout process with the following steps:

1. Basket

   adjust basket (add/remove/change items)

2. Shipping Address

   enter shipping address

3. Payment

   choose payment method + enter conditional details

4. Confirmation

   review data, accept GTC submit order (handle exceptions)

5. Feedback

   user feedback when order was successful

Order Model

The order model consists of straight forward java bean classes, (some methods return calculated values based on the properties, such as Basket.getTotalPrice())

Don't be confused by the validation annotations I'll talk about this topic in Part 3 LINK ME

Additional features

Custom I18N

using the same convenience functions in the zul and java code

Download

• The source code for this article can be found in github.

Running the Example

The example consists of a maven web application project. It can be launched with the following command:

   mvn jetty:run

Then access the overview page http://localhost:8080/wizardexample/order.zul

Comments

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