How to make your old web application use ajax to avoid page refresh

The problem
Have you already implemented a web application that works perfect but it doesn't make any ajax request? User are bored of unlimited refresh that happens each time they press any link or button?

The solution
I have the solution! Simply use ajax to make your request, the way you are used to and implement success function to update your pages' root element[1]!

Some code

1) Simply add the following JavaScript function in your js library:

function ajaxReq (requestURL, what2change){
$.ajax({
url: requestURL,
cache: false,
async: true,
dataType: 'html',
success: function(html){
var x = $(html);
$('#'+what2change,x).each(
function (i) {
document.getElementById(what2change).innerHTML=this.innerHTML;
}
);
}
});

And use it writting something like the following:
a) <input onclick="ajaxReq ('index.jsp?param1=2','root')" type="button">
b) <a href="http://www.blogger.com/post-edit.do#" onclick="ajaxReq ('index.jsp?param1=2','root')">

[1] In most cases you have some div or table that contains the part of the page that changes in each refresh. This should have a specific id the value of this id should be set also as value of the variable 'what2change' in the ajaxReq function.

Additional Information
If you use JavaScript that runs while your page is being rendered, then you should also read my new post "How to run JavaScript after sucessful completion of Ajax request" that is based on the articles http://www.developersnippets.com/2009/05/20/evaluate-scripts-while-working-on-ajax-requests/ and http://www.linein.org/blog/2009/06/05/run-javascript-code-after-an-ajax-request/

Metawidget, a useful framework for easy UI development

I currently work on a project that requires a lot of forms to be implemented. For that reason I had either to design each form using a visual tool (e.g. Matisse[1]), or a domain driven design (e.g. Naked Objects pattern[2]). Due to the fact that requirements may change at any time and everything should similar, I preferred the solution of domain-driven design.
Developing a model that support everything that is required for the application and adding metadata that will be useful for the UI is a very good combination for easy and agile development of a user friendly application! While I was designing my solution I discovered that there is a new framework that could help me. It's named Metawidget[3]. Metawidget offers integration with several front end frameworks. The only framework that I have used is swing, and I would like to inform you that it works perfectly and it is easy to add your own code to extend the functionality. For instance if you need to use some additional attribute to specify how a member should be shown then you can do it easily[4]!
Try it, and if you need any help just ask me!


[1] Swing GUI Builder (formerly Project Matisse) (http://netbeans.org/features/java/swing.html)
[2] Naked Objects is an architectural pattern where User Interface (UI) is just reflection of the model. For more details see http://en.wikipedia.org/wiki/Naked_objects
[3] Metawidget is an open source project that helps you to easily generate graphical user interface for desktop, web and mobile applications. It is simply a bridge between back-end architecture (using annotations or xml files for metadata) and existing front-end frameworks (such as Swing,Java Server Faces, Struts, Android). For more informations visit the official web site http://www.metawidget.org/
[4] The only case that I can't find an efficient solution is the one that I need a JTable to represend and edit values of a java.util.Collection, but I hope that I will find the way to do it!