Updating the model via AJAX

Victor,

I find Tor's and Greg M's bpcatalog documents describing AJAX and JSF useful. However they do not address 'updates'.

Updating the model via an AJAX request that is handled by the JSF framework as suggested by bccatalog examples is a challenge.

I am not sure if it is best to use the "Update Model" phase of the life cycle or just cheat and put he update code in the tags render response phase. Also, it appears that the "update model Phase" may not be included in the lifecycle as the ajax request is not really a JSF "postback".

Does anyone know what tradeoff result in doing an update in the Render Response Phase?

Cheers,

Godfrey

[689 byte] By [GodfreyVana] at [2007-10-2 16:45:57]
# 1

I've tried updating the model using AJAX and a RenderPhaseListener, but never succeeded. I have a simple CRUD form with two selectOneMenu components, some text boxes, and a submit button. When a selection is made in the first select list, an AJAX call is made that populates the second select list. Once that happens, the second select list contains a different list of <f:selectItems> in the DOM than it does in the underlying component model. If the array of SelectItems that are used to populate the second select list is in a managed bean, when the form is submitted, the second select list fails validation (Validation Failed: Not a Valid Value) because the selected item exists in the DOM, but not in the SelectItem array in the managed bean. To work around this, I placed the SelectItem array in the session, instead of in the managed bean. When the AJAX call is made, the backend Java code updates the SelectItem array in the session. This prevents the model and the DOM from getting out of synch. I hate putting anything in the session, because sessions tend to die, but this is the best workaround I could come up with. I'm open for any better solutions. Oh, by the way, if I use AJAX enabled select lists on a JSF page in a JSF 1.0 web app, the Invoke Application phase is mysteriously skipped when the form is submitted, which prevents the form contents from being saved. If I use JSF 1.1_01, the form saves like a charm. You gotta love being on the bleeding edge.

pschlenkera at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 2

I've also got an issue connected with using AJAX with JSF:

I do "update" the contents of a selectMenu via AJAX. This is done completely independent from JSF, the JavaScript calls a separate servlet. I wanted to have the AJAX component separated from the JSF architecure, but now there is a strange bahviour:

When the AJAX updates the list of selection options in a select element (this is dependant on another select element), at the moment of submittal, the actual value and list of options get discarded by JSF. As if the change in the DOM in the browser would not be reflected in the JSF model. I can see, that this cannot happen dynamically, but I thought JSF would update its list of selection possibiliites and current value automatically at form submit.

Am I doing something wrong or is this a limitation of JSF?

In the second case, I would have to integrate my AJAX component closer with the JSF environment.

misiua at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 3
misiu,The submit you mention is a 'postback'. Can you reply to this message with the http request and response that happens when the submit happens.In firefox you can do this with firebug or live headers.Cheers,Godfrey
GodfreyVana at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 4

Godfrey,

I do not completely understand what you mean.

My problem is, that when the postback happens, JSF does not update its model (the data that has a value binding to the model and was updated by AJAX previously) to the content that is displayed in the web browser. I'm not sure where this comes from.

As far as I understood, the main question when you are using AJAX is: how you get the JavaScript code to the web browser (seperate file, javascript in the jsp or using the renderer) and how you deal with http requests the xmlhttprequest object in the web browser does (integrate it somehow in the JSF model, use a filter or a separate servlet). As I decided for a servlet, I cannot change the data that is in the JSF model until there is a postback. But appartently JSF does not update it, even after the postback. I don't know if this is a limitation or I'm doing something wrong (hopefully).

Thanks

misiu

misiua at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 5

misiu,

I understand your problem and am also experiencing the same issue. I wanted you to show me the postback that your browser sends to the server to make sure that the form values are correctly set. As long as the postback is good the backing bean should be updated by the JSF controller as expected.

In the mean time if you get things working let me know.

Cheers,

Godfrey

GodfreyVana at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 6

Misiu,

I have solved this problem. I needed to create a decode method in my AJAX component class.

See:Performing Decoding in http://java.sun.com/j2ee/1.4/docs/tutorial/doc/JSFCustom7.html

the code should be like this:

public void decode(FacesContext context, UIComponent component)

{

if ((context == null) || (component == null)) {

throw new NullPointerException();

}

MapComponent map = (MapComponent) component;

String key = comp.getId();

String value = (String)context.getExternalContext().

getRequestParameterMap().get(key);

if (value != null)

map.setCurrent(value);

}

}

Let me know if this works for you.

Cheers,

Godfrey

GodfreyVana at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 7

Godfrey,

thanks for your solution, I'm sure it will help me.

However, I still do net get the way how JSF processes its data. When I dynamically change the value of a component, it should work. If I dynamically change lets say the list of possible values in a select, then there is a problem with the processing.

Ultimately, I believe there will be no way, how I can integrate AJAX into JSF without also having to change some implementation in the JSF code - see the decode method as an example, which does nothing more than the standard implementation should do.

That makes me rather sad, as I thought JSF would be there to take off work from you, instead of generating inconsistencies that you have to deal with individually.

Is there any framework yet, that integrates AJAX with JSF?

Cheers,

Misiu

misiua at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 8
Did you take a look at ajaxanywhere http://ajaxanywhere.sourceforge.net/ ?It'll be less efficient that the other approaches, but seems to work fine for most cases and requires only very litte changes to the app.Yours,Stefan
krausest1a at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 9

Hi,

I am building a linked set of autocomplete combo boxes. They can be linked up to each other and should fufill the requirements you described in your frist posting.

Let me know if you are interested in becoming an Alpha tester and you may be able to get the commericial components at no cost.

Cheers,

Godfrey

ghobbs@ebusinessapps.com

GodfreyVana at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...
# 10

Godfrey :

I am also trying to implement AJAX in JSF for 2 different list boxes like U. But, having an issue with JSF's Validation phase, getting "Validation error: Value is not valid".

I have seen ur explanation in this forum...

Can you please brief me about the below statement of yours?

"I needed to create a decode method in my AJAX component class."

Here are my questions....

Where to write the decode? (managed bean / servlet)

When is it invoked?

Please provide me with some sample code.

Thanks,

Vasu.

vasu@java.sun.coma at 2007-7-13 17:56:21 > top of Java-index,Enterprise & Remote Computing,Web Tier APIs...