Hello Dan,
Thank you for your reply!!!
You are right, if I give the refresh a list ids, the corresponding elements
will be submitted...
However here is what I am trying to achieve,
I have a textField (form1:txtID) and I want to update the remaining fields
asynchronously after submitting this field.
If I use the resfresh functionality as you described I would do the
following:
var node2 = document.getElementById("form1:textField2");
node2.refresh('form1:txtID');
This would cause node2 to be updated asynchronously after txtID has been
submitted.
But what if I have more than one such textField that needs to be updated
AFTER txtID has been submitted.
I have tried the following:
var node2 = document.getElementById("form1:textField2");
node2.refresh('form1:txtID, form1:textField3, form1:txtField4');
But obviously this does not work, simply because the values of these
elements are being submitted and not refreshed.
Also the following does not work:
var node2 = document.getElementById("form1:textField2");
node2.refresh('form1:txtID');
document.getElementById("form1:textField3").refresh();
document.getElementById("form1:textField4").refresh();
Because the last two statements do not wait for the ajax response to come
back.
Could you suggest any possible work around that would allow me to refresh
multiple elements after submitting one element?
Thanks again,
-Rasha
Dan Labrecque wrote:
>
> 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!
>>
>>
>>
>>
>>
>>
>
>
>
--
View this message in context: http://www.nabble.com/Woodstock-%2B-AJAX-tf4718627.html#a13505279
Sent from the Project Woodstock - Users mailing list archive at Nabble.com.