-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi All,
We want a javascript function to change the text of a textbox and the bean field with it. We have got it so the textbox text is changed but the bean is not updated.
Here is an example:
Person.java
package test; public class Person { private String firstName = ""; private String lastName = ""; private Boolean married = true; public Person( ) { } public Person( String firstName, String lastName, Boolean married ) { firstName = firstName; lastName = lastName; married = married; } public String getFirstName( ) { return firstName; } public void setFirstName( String firstName ) { this.firstName = firstName; } public void setLastName( String lastName ) { this.lastName = lastName; } public String getLastName( ) { return lastName; } // getter and setters public void setFullName( String f ) { // do nothing } public String getFullName( ) { return firstName + " " + lastName; } }
Zul File
<?init class="org.zkoss.zkplus.databind.AnnotateDataBinderInit" ?> <window> <zscript> import test.Person; Person person = new Person(); person.setFirstName("First"); person.setLastName("Last"); void createListener (Textbox w) { w.setWidgetListener("onChange","this.setValue(onChangeTest(this.getValue()));"); } </zscript> <grid width="400px"> <rows> <row> First Name: <textbox onCreate="createListener(self);" value="@{person.firstName}"/></row> <row> Last Name: <textbox value="@{person.lastName}"/></row> <row> Full Name: <label value="@{person.fullName}"/></row> </rows> </grid> <script type="text/javascript"> <![CDATA[ function onChangeTest (s) { s = 'TEST'; return s; }; ]]> </script> </window>
When you change the first name from "First" to whatever you type, the onChange of the javascript fires and replaces the First name to be 'TEST', but you can see that the Full Name is whatever you typed, not "TEST Last".
Does anyone know how to fix this?
Thanks!
Hi Shane,
You have to fire onChange to server after you update a new value
w.setWidgetListener("onChange","this.setValue(onChangeTest(this.getValue()));this.fireOnChange();");
We have added fire onChange to the above code, but now we get a few errors:
Within IE we now get a javascript error:
A Runtime Error has occurred. Do you wish to Debug? Line 9 Error: 'zk' is null or not an object
Using Firebug with FireFox it displays the following:
too much recursion zk()()zk.wpd (line 8) zk()()zk.wpd (line 8) zk()(Window test.zul, undefined)zk.wpd (line 8) zk.wpd()()zk.wpd (line 8) [Break on this error] (function(aB,z){var Z=aB.document;var a=... aR==="string"?aR:aR+"px")}})})(window);
We are using zk5.05.
Have we done something wrong?
You have to change the data that will be send to server.
void createListener(Textbox w) { w.setWidgetListener("onChange", "var value = onChangeTest(this.getValue());"+ "this.setValue(value);"+ "event.data.value = value;"); }
Excellent thanks as1225!
Is there any documents with this information on?
You can refer to the following link.
http://docs.zkoss.org/wiki/Notify_Server
http://docs.zkoss.org/wiki/How_to_Process_Request_with_JSON
and you can open the firebug's console in the FireFox to see the AU request.
it will show what data will be dend to server.
Thanks again as1225 :)
I have same problem using textbox,jquery and mask:
.zul
<hlayout>Phone:
<textbox id="txtPPhone1" width="130px" disabled="false" oncreate="createListener(self);" value="@bind(vm.phone)"/>
</hlayout>
<zscript>
void createListener(Textbox w) {
w.setWidgetListener("onBind", "jq(this).mask('(999) 999-9999');");
}
</zscript>
Asked: 2010-11-14 15:39:35 +0800
Seen: 788 times
Last updated: Apr 09 '14