|
|
(2 intermediate revisions by one other user not shown) |
Line 1: |
Line 1: |
− | {{ZKDevelopersReferencePageHeader}}
| + | #REDIRECT [[ZK Developer's Reference/MVVM/Data Binding]] |
− | | |
− | After adding the source data and activating the data-binding manager, you have to define the required UI objects and then associate them with the data source. ZUML annotation expression can be used to tell the data-binding manager the relationship between the data source and UI components. Its usage is very straightforward, simply by declaring the annotation into the component's attribute directly.
| |
− | | |
− | <tt><component-name attribute-name="@{bean-name.attribute-name}'''"'''/></tt>
| |
− | | |
− | * <tt>component- name</tt> representing a UI component
| |
− | * <tt>attribute- name</tt> representing an attribute of UI component or the data source
| |
− | * <tt>bean- name </tt>representing a data source
| |
− | | |
− | We use <tt>Grid</tt> as an example, and associate it with the data source, a <tt>Person</tt> instance. In this example, data-binding manager will automates the synchronization between UI components and the data source automatically.
| |
− | | |
− | <source lang="xml" >
| |
− | <?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" ?>
| |
− | | |
− | <window>
| |
− | <zscript><![CDATA[
| |
− | //prepare the example person object
| |
− | Person person = new Person();
| |
− | person.setFirstName("George");
| |
− | person.setLastName("Bush");
| |
− | ]]>
| |
− | </zscript>
| |
− | | |
− | <grid width="400px">
| |
− | <rows>
| |
− | <row> First Name: <textbox value="@{person.firstName}"/></row>
| |
− | <row> Last Name: <textbox value="@{person.lastName}"/></row>
| |
− | <row> Full Name: <label value="@{person.fullName}"/></row>
| |
− | </rows>
| |
− | </grid>
| |
− | </window>
| |
− | </source>
| |
− | | |
− | =Version History=
| |
− | {{LastUpdated}}
| |
− | {| border='1px' | width="100%"
| |
− | ! Version !! Date !! Content
| |
− | |-
| |
− | |
| |
− | |
| |
− | |
| |
− | |}
| |
− | | |
− | {{ZKDevelopersReferencePageFooter}}
| |