|
|
| (One intermediate revision by one other user not shown) |
| Line 1: |
Line 1: |
| − | {{ZKDevelopersReferencePageHeader}}
| + | #REDIRECT [[ZK Developer's Reference/MVVM/Data Binding]] |
| − | | |
| − | One data source could be associated with multiple UI components. Once the data source had been modified, those associated UI components will be updated automatically by the Data Binding Manager.
| |
| − | | |
| − | In the following example. we use ZUML annotation expression to associate a data source, a <tt>Person</tt> instance, "<tt>selected</tt>" with multiple UI components, including <tt>Listbox</tt>, and <tt>Grid</tt>. Once the user selects an item in the <tt>Listbox</tt>, the <tt>Grid</tt> will display information of the selected person accordingly.
| |
| − | | |
| − | <source lang="xml" >
| |
| − | <?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit"?>
| |
| − | | |
| − | <window width="500px">
| |
| − | <zscript><![CDATA[
| |
| − | //prepare the example person
| |
| − | Person selected = new Person();
| |
| − | ]]>
| |
| − | </zscript>
| |
| − | | |
| − | <listbox rows="4" selectedItem="@{selected}">
| |
| − | <listhead>
| |
| − | <listheader label="First Name" width="100px" />
| |
| − | <listheader label="Last Name" width="100px" />
| |
| − | <listheader label="Full Name" width="100px" />
| |
| − | </listhead>
| |
| − | <listitem>
| |
| − | <listcell label="George" />
| |
| − | <listcell label="Bush" />
| |
| − | </listitem>
| |
| − | <listitem>
| |
| − | <listcell label="Bill" />
| |
| − | <listcell label="Gates" />
| |
| − | </listitem>
| |
| − | </listbox>
| |
| − | <!-- show the detail of the selected person -->
| |
| − | <grid>
| |
| − | <rows>
| |
| − | <row>
| |
| − | First Name:
| |
| − | <textbox value="@{selected.firstName}" />
| |
| − | </row>
| |
| − | <row>
| |
| − | Last Name:
| |
| − | <textbox value="@{selected.lastName}" />
| |
| − | </row>
| |
| − | </rows>
| |
| − | </grid>
| |
| − | </window>
| |
| − | </source>
| |
| − | | |
| − | | |
| − | =Version History=
| |
| − | {{LastUpdated}}
| |
| − | {| border='1px' | width="100%"
| |
| − | ! Version !! Date !! Content
| |
| − | |-
| |
| − | |
| |
| − | |
| |
| − | |
| |
| − | |}
| |
| − | | |
| − | {{ZKDevelopersReferencePageFooter}}
| |