<zk xmlns="http://www.zkoss.org/2005/zul"

      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

      xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul/zul.xsd"

      xmlns:a="http://www.zkoss.org/2005/zk/annotation">   

<?page id="simplePage" title="Simple ZK Application using Grid and Annotations "?>

<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" arg0="controller"?>

<window id="controller"  use="com.ebpm.webdemo.zk.SimpleWindow3b" border="normal"

             width="800px" height="500px">

    <caption label="Simple Window Demo using Listbox and codeless Annotations"/>        

    <grid>

    <rows>

    <row>* Lastname: <textbox id="lastname" value="@{controller.PersonBean.lastname, save-when='ok.onClick', save-when='controller.onOK', load-when='ok.onClick'}" width="300px" constraint="no empty"/></row>

    <row>* Firstname: <textbox id="firstname" value="@{controller.PersonBean.firstname, save-when='ok.onClick', load-when='ok.onClick'}" width="300px" constraint="no empty"/></row>

    <row>  Address: <textbox id="address" value="@{controller.PersonBean.address, save-when='ok.onClick', load-when='ok.onClick'}" width="300px"/></row>

    <row>  Weight: <decimalbox id="weight" value="@{controller.PersonBean.weight, save-when='ok.onClick', load-when='ok.onClick'}" width="50px" constraint="no negative"/></row>

    <row>  Birthdate: <datebox id="birthdate" value="@{controller.PersonBean.birthdate, save-when='ok.onClick', load-when='ok.onClick'}" format="dd.MM.yyyy"/></row>

      <row spans="2"> 

            <hbox>

                  What is your favorite color?:

                  <combobox id="color" value="@{controller.PersonBean.color, save-when='ok.onClick', load-when='ok.onClick'}">

                        <comboitem label="Red" description="Red means Red ;-)" value="r1"/>

                        <comboitem label="Green" value="g2"/>

                        <comboitem label="Blue" value="b2"/>

                  </combobox>      

            </hbox>

      </row>

      <row spans="2"> 

            <hbox>

                  <checkbox id="married" checked="@{controller.PersonBean.married, save-when='ok.onClick', load-when='ok.onClick'}" label="Are you married?"/>

            </hbox>

      </row>

      <row spans="2">

            <groupbox>

                  <caption label="How much do you like yourself?:"/>

                  <radiogroup id="rating" selectedItem="@{controller.PersonBean.rating, save-when='ok.onClick', load-when='ok.onClick'}">

                        <radio value="1" label="Actually, I hate me."/>

                        <radio value="2" label="Not so much."/>

                        <radio value="3" label="I'm indifferent."/>

                        <radio value="4" label="I'm pretty neat."/>

                        <radio value="5" label="I'm totally in love with me."/>

                  </radiogroup>          

            </groupbox>

      </row>

    </rows>

    </grid>

      <separator/>

      <button id="ok" label="Submit" forward="onOK"/><button label="Cancel" forward="onCancel"/>

      <separator/>

      <listbox id="personsList" model="@{controller.allPersons}">

            <listhead sizable="true">

                  <listheader label="First Name" />

                  <listheader label="Last Name" />

                  <listheader label="Address" />

                  <listheader label="Weight" />

                  <listheader label="Birthdate" />

                  <listheader label="Color" />

                  <listheader label="Married" />

                  <listheader label="Rating" />

            </listhead>

            <listitem id="personsItems" self="@{each=person}">

                  <listcell label="@{person.firstname}" />

                  <listcell label="@{person.lastname}" />

                  <listcell label="@{person.address}" />

                  <listcell label="@{person.weight}" />

                  <listcell label="@{person.birthdate}" />

                  <listcell label="@{person.color}" />

                  <listcell label="@{person.married}" />

                  <listcell label="@{person.rating}" />

            </listitem>

      </listbox>

</window>

</zk>