Ajax and JSF 1.1 using hidden iframe with "proxy forms", what do you think about this development strategy?

Question

Hi, currently I am using yet 1.1 specs, so I am trying to make simple what is too complex for me :p, managing backing beans with conflicting navigation rules, external params breaking rules and so on... for example when I need a backing bean used by other "views" simply I call it using FacesContext inside other backing beans, but often it's too wired up to JSF navigation/initialization rules to be really usable, and of course more simple is more useful become the FacesContext.

So with only a bit of cross browser Javascript (simply a form copy and a read-write on a "proxy" form), I create a sort of proxy form inside the main user page (totally disassociated from JSF navigation rules, but using JSF taglibs). Ajax gives me flexibility on the user interaction, but data is always managed by JSF.

Pratically I demand all "fictious" user actions to an hidden "iframe" which build up all needed forms according JSF rules, then a javascript simply clone its form output and put it into the user view level (CSS for showing/hiding real command buttons and making pretty), the user plays around and when he click submit, a script copies all "proxied" form values into the real JSF form inside the "iframe" that invokes the real submit of the form, what it returns is obviously dependent by your choice.

Now JSF is really a pleasure :-p

My real interest is to know what are your alternative strategy for using pure Ajax and JSF 1.1 without adopting middle layer like ajax4jsf and others, all good choices but too much "plugins" than specs.

Answer 1

My suggestion is that you take a look at the Javascript frameworks out there, for example Prototype or JQuery. They have functionality that allows you to serialize form data and send it to the server using Ajax. Then you can get the answer back, and display it on the web page. Take a look at Prototype's Form.serialize and Ajax.Updater. I think it's a more cleaner way of doing things than using "proxy" iframes and forms.

Say you have a form and you want to send it to the server and replace the form with an HTML snippet from the server. This is one way of doing it using Prototype:

new Ajax.Updater('divThatWrapsTheFormTag', 'someUrl', {
  parameters: Form.serialize('formId')
});