0

DataBind: how to reload the value ?

asked 2010-05-29 12:51:39 +0800

gramberg gravatar image gramberg
111 1 2

updated 2010-05-29 12:51:50 +0800

Hi,

I try the first time with ZK + Databind.

How do I reload teh values, when I changed data.

The databinding works fine, I see two field with the values, now I try to have a buttom,
which change a value and I want to show the changed data in the field.

I tried it like this. (see below).
but the "binder.loadAll" does not show the new value "*** New ***".

Any idea, what could be wrong ?

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

<zscript>
<![CDATA[
    import de.gramberg.model.Gutacht;  
                  
    Gutacht gut = new Gutacht();
	
    //prepare the AnnotateDataBinder
    AnnotateDataBinder binder = new AnnotateDataBinder();
    binder.bindBean("gut", gut);

]]>
</zscript>

.........

<button label="new-value / Reload" 
        onClick='gut.setKurz( "*** New ***");binder.loadAll()' />

			<intbox	value="@{gut.nr,    save-when='self.onChange'}" />
			<textbox	value="@{gut.kurz, save-when='self.onChange'}" />

....

</zk>

Java Code

	public String getKurz() {
		return _kurz;
	}

	public void setKurz(String kurz) {
		_kurz = kurz;
	}

delete flag offensive retag edit

3 Replies

Sort by ยป oldest newest

answered 2010-05-30 07:48:22 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

updated 2010-05-30 07:56:59 +0800

A little bit modifications, for a better basic skeleton. You must adapt it to your needs.



zul-file for playing

<?xml version="1.0" encoding="UTF-8" ?>
<?taglib uri="http://www.zkoss.org/dsp/web/core" prefix="c"?>

<zk xmlns="http://www.zkoss.org/2005/zul"
	xmlns:h="http://www.w3.org/1999/xhtml"
	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">

	<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++ -->
	<!-- DataBinding Initiator.                              -->
	<!-- +++++++++++++++++++++++++++++++++++++++++++++++++++ -->
	<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" arg0="./windowGrambergTest" ?>

	<window id="windowGrambergTest"
		apply="de.gramberg.webui.test.GrambergTestCtrl" border="none"
		width="100%">

		<button id="btnTest1" label="changed beanProperties to Willis" />
		<button id="btnTest2" label="changed beanProperties to Hanks" />

		<vbox>
			<textbox id="txtb_personLastname"
				value="@{controller.person.lastName}" readonly="true" />
			<textbox id="txtb_personFirstname"
				value="@{controller.person.firstName}" readonly="true" />
			<textbox id="txtb_personCity"
				value="@{controller.person.city}" readonly="true" />
			<textbox id="txtb_personStreet"
				value="@{controller.person.street}" readonly="true" />
			<textbox id="txtb_personPhone"
				value="@{controller.person.phone}" readonly="true" />
		</vbox>

		<h:hr />
		<separator />

		<vbox>
			<textbox id="txtb_personLastnameNew" />
			<button id="btnTestSave" label="change manual LastName" />
		</vbox>

	</window>
</zk>

.

GrambergTestCtrl .java (Java-Controller for the zul-file
)
public class GrambergTestCtrl extends GenericForwardComposer implements Serializable {

	private static final long serialVersionUID = 1L;

	/**
	 * ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	 * All the components that are defined here have a corresponding component
	 * with the same 'id' in the zul-file. <br>
	 * 
	 * 1. They are getting autowired by the GenericForwardComposer.<br>
	 * 2. Their events are 'forwarded' automatically by the
	 * GenericForwardComposer.<br>
	 * 
	 * Can access them with followed code:<br>
	 * 
	 * public void onEventName&componentId(Event event){...} <br>
	 * public void onClick&btnTest(Event event){...} <br>
	 * ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	 */
	protected Window windowGrambergTest; // autowired
	protected Button btnTest1; // autowired
	protected Button btnTest2; // autowired
	protected Button btnTestSave; // autowired

	protected Textbox txtb_personLastnameNew; // autowired

	// binding stuff
	private AnnotateDataBinder binder = null;
	private Person person;

	@Override
	public void doAfterCompose(Component window) throws Exception {
		super.doAfterCompose(window);

		// set the composer's name in the zul page as an ALIAS for access.
		if (self != null)
			self.setAttribute("controller", this, false);
	}

	/**
	 * This event is called automatically by zk.
	 * 
	 * @param event
	 */
	public void onCreate$windowGrambergTest(Event event) {
		System.out.println("EventName/ComponentID : " + event.getName());

		binder = (AnnotateDataBinder) event.getTarget().getAttribute("binder", true);

		// init the bean with the first record in the personList
		Person person = new Person();
		person.setId(1100);
		person.setFirstName("Tom");
		person.setLastName("Hanks");
		person.setCity("Chicago");
		person.setStreet("5, Boulderdrive");
		person.setPhone("123456789");

		// init the binding mechanism
		setPerson(person);
		// beanToUi
		binder.loadAll();
	}

	/**
	 * Forwarded 'onClick' button event.
	 * 
	 * @param event
	 */
	public void onClick$btnTest1(Event event) {
		System.out.println("EventName/ComponentID : " + event.getName());

		// change the persons name
		getPerson().setFirstName("Bruce");
		getPerson().setLastName("Willis");
		getPerson().setCity("New York");
		getPerson().setStreet("Hugo-Menzies-Drive");
		getPerson().setPhone("76353535353");

		// beanToUi
		binder.loadAll();
	}

	/**
	 * Forwarded 'onClick' button event.
	 * 
	 * @param event
	 */
	public void onClick$btnTest2(Event event) {
		System.out.println("EventName/ComponentID : " + event.getName());

		// change the persons name
		getPerson().setFirstName("Tom");
		getPerson().setLastName("Hanks");
		getPerson().setCity("Chicago");
		getPerson().setStreet("5, Boulderdrive");
		getPerson().setPhone("123456789");

		// beanToUi
		binder.loadAll();
	}

	/**
	 * Forwarded 'onClick' button event.
	 * 
	 * @param event
	 */
	public void onClick$btnTestSave(Event event) {
		System.out.println("EventName/ComponentID : " + event.getName());

		// change the persons LastName from the Textbox
		getPerson().setLastName(txtb_personLastnameNew.getValue());

		// beanToUi
		binder.loadAll();
	}
	
	

	// +++++++++++++++++++++++++++++++++++++++++++++++++ //
	// ++++++++++++++++ Setter/Getter ++++++++++++++++++ //
	// +++++++++++++++++++++++++++++++++++++++++++++++++ //

	public void setPerson(Person person) {
		this.person = person;
	}

	public Person getPerson() {
		return person;
	}

}


Person.java (Test Bean like your Gutacht.java
)

public class Person implements Serializable {

	private static final long serialVersionUID = -4591732272301777879L;

	private int id = 0;
	private String firstName = "";
	private String lastName = "";
	private String city = "";
	private String street = "";
	private String phone = "";
	private String fax = "";

	public Person() {
	}

	public Person(int id, String firstName, String lastName, String city, String street, String phone, String fax) {
		this.setId(id);
		this.firstName = firstName;
		this.lastName = lastName;
		this.city = city;
		this.street = street;
		this.phone = phone;
		this.fax = fax;
	}

	public void setId(int id) {
		this.id = id;
	}

	public int getId() {
		return id;
	}

	public void setFirstName(String firstName) {
		this.firstName = firstName;
	}

	public String getFirstName() {
		return firstName;
	}

	public void setLastName(String lastName) {
		this.lastName = lastName;
	}

	public String getLastName() {
		return lastName;
	}

	public void setCity(String city) {
		this.city = city;
	}

	public String getCity() {
		return city;
	}

	public void setStreet(String street) {
		this.street = street;
	}

	public String getStreet() {
		return street;
	}

	public void setPhone(String phone) {
		this.phone = phone;
	}

	public String getPhone() {
		return phone;
	}

	public void setFax(String fax) {
		this.fax = fax;
	}

	public String getFax() {
		return fax;
	}

	@Override
	public int hashCode() {
		final int prime = 31;
		int result = 1;
		result = prime * result + ((city == null) ? 0 : city.hashCode());
		result = prime * result + ((fax == null) ? 0 : fax.hashCode());
		result = prime * result + ((firstName == null) ? 0 : firstName.hashCode());
		result = prime * result + id;
		result = prime * result + ((lastName == null) ? 0 : lastName.hashCode());
		result = prime * result + ((phone == null) ? 0 : phone.hashCode());
		result = prime * result + ((street == null) ? 0 : street.hashCode());
		return result;
	}

	@Override
	public boolean equals(Object obj) {
		if (this == obj)
			return true;
		if (obj == null)
			return false;
		if (getClass() != obj.getClass())
			return false;
		Person other = (Person) obj;
		if (city == null) {
			if (other.city != null)
				return false;
		} else if (!city.equals(other.city))
			return false;
		if (fax == null) {
			if (other.fax != null)
				return false;
		} else if (!fax.equals(other.fax))
			return false;
		if (firstName == null) {
			if (other.firstName != null)
				return false;
		} else if (!firstName.equals(other.firstName))
			return false;
		if (id != other.id)
			return false;
		if (lastName == null) {
			if (other.lastName != null)
				return false;
		} else if (!lastName.equals(other.lastName))
			return false;
		if (phone == null) {
			if (other.phone != null)
				return false;
		} else if (!phone.equals(other.phone))
			return false;
		if (street == null) {
			if (other.street != null)
				return false;
		} else if (!street.equals(other.street))
			return false;
		return true;
	}

}

best
Stephan

link publish delete flag offensive edit

answered 2010-05-31 11:25:44 +0800

robertpic71 gravatar image robertpic71
1275 1

Hi gramberg,

you are mixing 2 different solutions:

Variant 1:
- use xml-setup for the databinder (<?init ...) and catch the binder-instance i.e. in the onCreate-event like Stephan's examplecode

Variant 2:
- setup you own binder and DO NOT USE the <?init ... tag!!

some other faults:
when you setup your own binder, the binder needs the root UI-Element
new AnnotateDataBinder(guiRoot);

The correct timing is very important - when you setup your binder, there is no rendered UI.
I prefer the afterCompose for the bindersetup - when using a composer.

However, here is an small zscript-example - working inside the ZK Demo Page:

<window id="mywin" onCreate="bind();">
<zscript>
<![CDATA[
   import org.zkoss.zkdemo.userguide.Person;
                  
    Person gut = new Person("first", "last");
    AnnotateDataBinder binder;
	
    void bind() { 
       //prepare the AnnotateDataBinder
       binder = new AnnotateDataBinder(mywin);
       binder.bindBean("gut", gut);
       binder.loadAll();
    }

]]>
</zscript>

<button label="new-value / Reload" 
        onClick='gut.setFirstName( "*** New ***");binder.loadAll()' />

			<textbox	value="@{gut.firstName,     save-when='self.onChange'}" />
			<textbox	value="@{gut.lastName, save-when='self.onChange'}" />


</window>

Some notes:
save-when -> self.onChange is the default for the most input-elements (there is no need to write that)

Alternative codeless-variant (with load-after):

<button id="btn" label="new-value / Reload" 
        onClick='gut.setFirstName( "*** New ***")' />

			<textbox	value="@{gut.firstName,  load-after='btn.onClick'}" />
			<textbox	value="@{gut.lastName,  load-after='btn.onClick'}" />

/Robert

link publish delete flag offensive edit

answered 2010-06-09 07:11:12 +0800

gramberg gravatar image gramberg
111 1 2

updated 2010-06-09 07:14:00 +0800

Hi,

I am surprised, that my last replay seems to be lost.
I use actual the small solution from Robert,
it was only small changes, I had to make.
Actual I can search and Update one record in the database.

Next step will be a list of selected records.

Thanks for the help so far.

<window id="mywin" onCreate="bind();">
<zk>

<zscript>
<![CDATA[
	import de.gramberg.model.Gutacht;
	Gutacht gut = new Gutacht();
		
	//prepare the AnnotateDataBinder
	AnnotateDataBinder binder;
	void bind() {
		//prepare the AnnotateDataBinder
		binder = new AnnotateDataBinder(mywin);
		binder.bindBean("gut", gut);
		binder.loadAll();
		
	}
]]>

ZK-Code for the two fields

					<button id="btnSelect"  label="Suchen - Gutachten "
						onClick='gut.select ( gut.getNr() ) ; binder.loadAll()' />

					<button id="btnUpdate"  label="Upate - Gutachten "
						onClick='gut.update ( ) ; binder.loadAll()' />

					<grid fixedLayout="true">
						<columns>
							<column label="Type" width="150px" />
							<column label="Content" />
						</columns>
						<rows>
							<row>Nr.		        <intbox	value="@{gut.nr, load-after='btnSelect.onClick'}" />	</row>
							<row>Bezeichnung	<textbox	value="@{gut.kurz }" width="400px" />	</row>
	

Yours Bernhard

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2010-05-29 12:51:39 +0800

Seen: 1,388 times

Last updated: Jun 09 '10

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More