List item Data Binding

 

Now let us see how we can load the items in the list item using Data binding.

Step 1:

Create a Zul Project as follows

 

Step 2 :

Create Person POJO Class

Java Code

package mydomain;

public class Person {

    private String _firstName = "";
    private String _lastName = "";

    // getter and setters
    public void setFirstName(String firstName) {
        _firstName = firstName;
    }

    public String getFirstName() {
        return _firstName;
    }

    public void setLastName(String lastName) {
        _lastName = lastName;
    }

    public String getLastName() {
        return _lastName;
    }

    public void setFullName(String f) {
        // do nothing.
    }

    public String getFullName() {
        return _firstName + " " + _lastName;
    }

}

 

Step 3 :

Demo.Zul File

<?xml version="1.0" encoding="UTF-8"?>
<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" arg0="./myWin" ?>
<zk>
    <window id='myWin' title="MVC example" border="normal"
        apply="mydomainUI.DemoComposer">
        Example for "for each" using MVC Controller
        <listbox model="@{myWin$DemoComposer.persons}">
            <listhead sizable="true">
                <listheader label="First Name" width="100px" />
                <listheader label="Last Name" width="285px" />
            </listhead>
            <listitem self="@{each=person}">
                <listcell label="@{person.firstName}" />
                <listcell label="@{person.LastName}" />
            </listitem>
        </listbox>
    </window>
</zk>

 

Step 4:

Composer

package mydomainUI;

import java.util.ArrayList;
import java.util.List;
import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.util.GenericForwardComposer;
import org.zkoss.zul.Textbox;
import mydomain.Person;

public class DemoComposer extends GenericForwardComposer {

    private List<Person> persons = new ArrayList<Person>();
    

    public void doAfterCompose(Component comp) throws Exception {
        super.doAfterCompose(comp);
        Person p1 = new Person();
        p1.setFirstName("John");
        p1.setLastName("Robert");
        persons.add(p1);

        p1 = new Person();
        p1.setFirstName("Rosy");
        p1.setLastName("Sean");
        persons.add(p1);

    }

    public List<Person> getPersons() {
        return persons;
    }

    

}

 

Step 5:

Run the ZUL File, The output as follows