In normal Struts application we generally use DispatchAction to make our web app and life easy. In general struts controller gets a request and delegates it to corresponding action/dispatchAction subclasses. Depending on the method name parameter our target method gets invoked and after processing of some business/domain objects finally forwards a mapping(configured in struts-config.xml) towards the view tier and a JSP gets rendered in our thin client as a response.

Now when we think of Ajax in this kind of application model, we can consider two types of implementation of Ajax: Partial Page Rendering and Partial Response update.

Problem: A form based application has too many fields to be filled in by the user but majority of the fields or group of fields are optional and it takes time to render those fields and thus the entire page.

JSP Solution: Break the optional fields and mandatory fields in two separate groups. And Break the JSP page in two and use JSP:INCLUDE to save some jsp rendering time. You can save approximately 5-7% of your loading time.

Ajax Solution  Have a different method in your DispatchAction for example renderOptionFields(…….)

And return a different forward mapping and in turn return a different JSP but a partial one which render only the optional fields.

And in that partial JSP page you just only include your necessary TLDs and render all the struts html tags with name attribute mentioned.

And now in your main JSP have a button called option fields having a javascript function call to render the option fields.

Including prototype.js is obvious and have the code as follows:

        <input type="button" value="Optional Fields" onClick="renderOptionalFields()"/>    <div id="optionalFieldsContainer"></div>    

<script>function  renderOptionalFields(){	var url ="/appcontext/yourDispatch.action?method=   renderOptionFields";	var params ="";	var updatePage = new Ajax.Updater(''optionalFieldsContainer'',url,		{			method:''get'',			parameters:params,			onFailure:reportError		}	);}function reportError(request) {	alert("Error Updaing Page");}</script>

When implementing Ajax based RUI in enterprise app there are very few options to choose from;

• Developing RIA from scratch
• Plumping various RUI widgets available from open source community
• FLEX (Flash Plug-in dependent) need FA-Bridge
• Open Laszlo Flash based RICH UI (XUL based like Flex)

Developing from scratch makes no sense at all. Because time required developing various widgets it takes too much of time to deliver an enterprise ready version of it. Then an entire framework of Ajax engine makes no sense when too many well-tested versions are available (Dojo, prototype, DWR etc).

Readily available RUI widgets are available from various open source projects like YUI, Scriptaculous etc. But yes, you have to tweak here and there to develop your desired one.

Flex has many advantages over other two options. Because you get support from ADOBE itself, have large community and more of all you get a well tested IDE which is definitely a plus.

Flex has a Licensing cost which you have to consider beforehand like Backbase which has a readily available struts compatible tag-libraries which is rich enough to meet the enterprise requirements.

Open Laszlo is another good option to explore, it is an open source solution having two way supports, single declarative UI with flash or JS based RUI.

But again before starts with any of the options we should define the scope and analyze the expectation of the user, and accordingly go with best possible options available.

Struts and Ajax how to?

Struts itself has absolutely nothing in this area up to 1.2.x, Struts 2 is coming up in big way with the in built features of Ajax. (Webworks2.x).

Prior to Struts 2 you have to re-align your existing server side code base according to your plan of providing RUI solution. And in doing this DWR , dojo, scriptaculous can become very helpful if you are implementing JS based RUI. In case of Flex you probably have to re-align your server side code a little bit more. Though there are some open source helper toolkits available.

Flex and Js based solution both are surprisingly easy to integrate with struts. Both are Servlet based solution.

In JS based solution Struts Tiles can plays a major role in shortening your development time.

Ajaxanywhere Tag-library and Ajax-display tag can be very helpful, and there are some other open source tag-libraries to explore.

Resources

http://ajaxtags.sourceforge.net/
http://ajaxanywhere.sourceforge.net/
http://javawebparts.sourceforge.net
http://www.getahead.ltd.uk/dwr/
http://www.nextapp.com/products/echo2/
http://sweetdev-ria.ideotechnologies.com/sweetdev-ria-gettingStarted-1.1-RC3//
http://dojotoolkit.org/
http://flex.org
http://www.openlaszlo.org/
http://labs.macromedia.com/wiki/index.php/Flex_Framework:FABridge
http://prototype.conio.net/
http://www.openrico.org/
http://script.aculo.us/
http://karaszewski.com/tools/ajaxlib/

For enterprise builders Ajax solved many problem of responsiveness of UI but problem of overall development methodologies using Ajax still remains with lot of contradictions and conflicts among the developers. When using Ajax in an Enterprise Application main problem faced by the developers are where to start and how to start. The major problem faced by the enterprise developers and architect in implementing Ajax based UI solutions in existing application.

No software solution is beyond the scope of SDLC actually, but in general found missing when implementing Ajax based solutions in an enterprise app. Ajax by nature has some tremendous side effects if practiced unethically (from SDLC perspective) and by overuse.

Where is the Silver bullet?

In Ajax oriented solutions there is no silver bullet till date. Ajax is not a technology it’s more of a technique. And the success of Ajax oriented approach depends upon the proper study of requirements. If you take wrong move at beginning you tend to suffer in later stage of your development cycle.

There is no short cut at all in development of Ajax oriented Rich UI based presentation layer development, it’s a full blown development cycle. Yes there are many toolkit, utilities, tag-libraries to help you develop Rich UI which is Ajax based but development effort of front end, server side code and architecture re-aligning is always be there to be estimated.

Where to start?

As I mentioned before, prior to know where to start and how start better you should know what to do first and your user expectations you are going to meet. Define the scope of Ajax based UI and usability options you are going to provide to your end-users.

But again to remind you that there is no silver bullet which can provide you hassle free Rich UI development in a minutes/hours for enterprise app. It needs extensive planning; architecting and testing that age-old mantra for developing Aax based Rich UI for enterprise app.

In Ajax based approach there are two pattern in development; Dom Manipulation and Partial Updation. Stuts2(Webworks2+) promised to provide some inbuilt features for both of them. But as of now in struts, up to 1.2.9 (I have evaluated up to this version of1.2.x) there are no Ajax materials to help.

So depending on the pattern you are going to use in your enterprise app you have to decide and design accordingly to develop your RUI.

To help your development of Ajax RUI you can use DWR, Dojo toolkit and SCRIPTACULOUS (All based upon prototype lib), Yahoo UI library is good enough to get some readymade widgets out of the box. But you are the person who will be the king of your Ajax app because of your customized need of your very own RUI.

Do not hesitate to take help from ajaxpattern.org for taking right design decision to negate the future disasters as I mentioned earlier.

If you have framed the scope of your UI enhancement try using Ajaxanywhere tag-library, it is really a good one and can shorten your development time in very effective way. Using pre-build Ajax tag-library can really reduce the development efforts, and there are so many to do so. Check out the resource section for that.

Check the first part of this article here

Web application has its own advantages over the age old Client Server Applications, and thus large enterprises adopted it as their prime choice whenever they tend to develop a new applications. And not only new application but stared to migrate their existing client server based enterprise application to web based application. HTTP the base layer has not been changed a lot to cope up with the enterprise user’s expectations.

Gradually form based applications started facing problems in meeting the user’s expectation and responsiveness of the applications started coming up as major issues. Usability of an application came up strongly and XML-RPC became popular in large enterprise applications and been there for long time to meet the user expectations to some extends.

Macromedia FLASH and the new technology called FLASH-Remoting, opened up new possibilities of Rich User Interface in thin clients. Enterprise App builders started thinking of various possibilities of using Rich User Interfaces in their Enterprise App. And java space tried to play their age old SWING card in various ways but unfortunately SWING was unable to gain the momentum. But developer community started thinking of Rich UI using SVG, SWING etc. but in a different approach, because till then enterprise builders have realized that MVC actually unable to separate the VIEW layer as they expected. Thus XUL has arrived in the scene. Still some declarative swing application project (XUL based) are still live in SF.

But thin client limitation was still a hitch for UI. Google came up with age old technique of MSDN on demand tree menu loading in a new package (Google Suggestion) and developer community acted promptly and AJAX was suddenly became the most HYPED buzzword in the developer community. But Macromedia has come up with XUL based (MXML) RIA development framework FLEX. Beta was a huge hit among the designer community but unable to attract the developer community because of the lack of support of PHP the most popular scripting language of WEB development. They come up with FLEX 1.5 with limited support of SOA which some how managed get the attention of the developer community. But designer community was thrilled because of the introduction of eclipse based IDE for designing FLASH web sites in hours. Laszlo open sourced their Laszlo systems(Flex counterpart) and RIA became hit. Yahoo joined the RIA party and developer and designer community join the party. CSS gained the momentum as well and join hands with the developers because of AJAX. Standard based web development became a popular practice and gave platform to shout for the designers and to establish a new term of WEB-Architect which is becoming poplar day by day.

As RIA became popular and lot of new Ajax oriented toolkit has came up, like dojo, DWR, Sajax Django etc. Lot of tag-libraries for java space has also come up like ajaxanywhre, ajaxtags etc.

In my next post I will try to convey the problems of RIA and Ajax implementations and some resources.

• Free hosting
• 30 MB of Web site storage
• 10 GB of bandwidth
• No setup or hidden fees
• Online customer support
• Daily backup (data retained for 30 days)

To use Microsoft Office Live Basics, you need the following: 

• Internet Explorer 5.5 with Service Pack 4 (SP4) or later running on Windows 98,
• Windows 2000, Windows XP, or Windows Server 2003
• Internet access via dial-up or broadband
• Super VGA (800 x 600) or higher-resolution display
• Certain features require Microsoft Office 2000 or higher
• Certain features require Internet Explorer 5.5 or later, Microsoft Office 2000 or later, and Windows XP