The widgets are only updated when the asynchronous call returns. In
fact, it only does so because the response generates an event to listen
for. If and only if the widget receives an event will it be updated.
The reason you not seeing an update is because you have not provided a
param to the refresh function. (When no parameter is given, the refresh
function acts as a reset. That is, the component will be redrawn only
using values available server-side.) However, if you provide a comma
separated list of ids, you can perform both submit and refresh using a
single statement.
Take a look at the examples provided in the Tag Library Documentation below.
http://webdev2.sun.com/woodstock-tlddocs
In the textField TLD, you will find the following example:
Example 7: Asynchronously update textField using refresh function
This example shows how to asynchronously update a text field using the
refresh function. The execute property of the refresh function is used
to define the client id which is to be submitted and updated
server-side. When the user clicks on the radio button, the input value
is updated server-side and the text field is updated client-side -- all
without a page refresh.
<webuijsf:radioButton id="rb1" name="rb1" label="Refresh Text Field" onClick="refreshField()"/>||||
<webuijsf:textField id="field1" text="#{MyBean.text}" /> // Field used to asynchronously update text.
|<webuijsf:script>
function ||refreshField||() {
var domNode = document.getElementById("form1:field1"); // Get field
return domNode.refresh("form1:rb1"); // Asynchronously refresh
while submitting radio button value
}
</webuijsf:script>
|Note that the refresh function can optionally take a list of elements
to execute. Thus, a comma-separated list of ids can be provided to
update components server-side: refresh("form1:id1,form2:id2,...").
Dan
Rashanova wrote:
> Hello,
> I am trying to understand how the submit() and refresh() functions of ajax
> components work.
>
> I have tried to setup the following code using pure jsf-extensions (dynamic
> faces):
> <webuijsf:textField binding="#{ManageSession.txtID}" id="txtID"
>
> onChange="DynaFaces.fireAjaxTransaction(this, { execute: 'form1:txtID'});"
> valueChangeListenerExpression="#{ManageSession.txtID_processValueChange}"/>
>
> The code works in an excellent way since rendering the components on the
> page will only take place after the ajax response comes back.
>
> However I have tried to achieve the same effect using the submit and refresh
> functions of the ajax components by writing something like:
> function changeEvent() {
> var node1 = document.getElementById("form1:txtID");
> node1.submit();
> var domNode = document.getElementById("form1:textField2");
> domNode.refresh();
> }
>
> The problem with the above code is that the refresh function is NOT waiting
> for the ajax response to come back. and Hence it is not picking up the
> latest value from the server. The only way I was able to get around this is
> by moving the "refresh" part to another function and using the setTimeout as
> follows:
> function changeEvent(){
> var node1 = document.getElementById("form1:txtID");
> node1.submit();
> setTimeout('updateSessionInfo()',1000);
> }
>
> function updateSessionInfo() {
> var domNode = document.getElementById("form1:textField2");
> domNode.refresh();
> }
>
> 1- Is there away I can get around this problem, and force the refresh to
> take place ONLY after the ajax response comes back to the client?
> 2- If not, how can I create a call back function on the client side that
> will wait for the ajax response in order to execute?
> 3- Since the first code snippet above (one using pure jsf dynamic faces)
> works fine, what is the benefit of the submit and refresh functions
> introduced into woodstock? and is it a good practice to use dynamic faces
> and I did in the above example?
>
> THanks a lot!
>
>
>
>
>
>