ZK8 Wizard Example - Part 1
From Documentation
Revision as of 07:31, 28 July 2015 by Robertwenzel (talk | contribs) (→More complex Usage (Order Wizard))
Author
Robert Wenzel, Engineer, Potix Corporation
Robert Wenzel, Engineer, Potix Corporation
Date
July/August 2015
July/August 2015
Version
ZK 8.0
ZK 8.0
Introduction
NOT copy paste example uses Java 8 (recommendations welcome)
Highlight MVVM separation of Model and View keeping the state in the ViewModel (WizardModel) Focussing on the wizard pages and wizard data.
use the new template approach with zk-shadow-elements <sh:if> <sh:forEach> <sh:apply> <sh:choose>
next steps - integrate new form binding/validation - integrate a bootstrap layout without changing the UI
A reusable Wizard class/template
- zk.example.wizard.model.WizardViewModel.WizardViewModel
- zk.example.wizard.model.WizardStep
- /wizardexample/src/main/webapp/WEB-INF/zul/template/wizard/wizard.zul
Simple Usage (Survey)
- /wizardexample/src/main/webapp/simple.zul
- /wizardexample/src/main/webapp/WEB-INF/zul/template/simplewizard/steps
More complex Usage (Order Wizard)
- Basket
- Shipping Address
- Payment
- Confirmation
- Feedback
Data Model
zk.example.order.api.Order
- Order
- Basket (basket items)
- Payment (payment method)
- CreditCard
- or BackAccount (based on payment method)
- ShippingAddress (city, street, zip code)
Form Row template
Additional features
Input Mask
Bookmarks Handling
Application Error Handling
More complex Usage (Order Wizard)
Summary
bla bla
What's next?
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/longoperations/overview.zul
And that's what you'll see:
Comments
| Copyright © Potix Corporation. This article is licensed under GNU Free Documentation License. |