Win a copy of Svelte and Sapper in Action this week in the JavaScript forum!

Barend Garvelink

Ranch Hand
+ Follow
since Dec 07, 2004
Cows and Likes
Cows
Total received
0
In last 30 days
0
Total given
0
Likes
Total received
0
Received in last 30 days
0
Total given
0
Given in last 30 days
0
Forums and Threads
Scavenger Hunt
expand Ranch Hand Scavenger Hunt
expand Greenhorn Scavenger Hunt

Recent posts by Barend Garvelink

I agree, first thing to do is to do a clean recompile and then jar up a new archive to copy to the PDA.
14 years ago

Can you tell me what would be involved in retrofitting AJAX logic into a Struts application?

If you use AJAX, is there still an advantage to making a new application into a Struts one?



Struts and AJAX are different technologies to solve different problems. One does not replace the other. AJAX is a client-side "add on" (so to speak) that you can use to improve the user interface. Struts is the good old server-side MVC framework that you're already familiar with.

The two can co-exist (in fact, the combination works very well together!). You can improve the user-interface of a struts application by using AJAX technology.

Sad thing is if you were to program in an object oriented way with JavaScript, you would not have any problem dealing with it! Look at the refactored code in Ajax IN Action and you will see how easy it is to handle this situation.



I have several years experience writing Object-Oriented Javascript, thank you very much. I'm well aware that the problems are solvable and have in fact done so in various different applications. Multiple XmlHttpRequests firing at once, all guarded by timeout checks and all properly updating the HTML DOM as their results are in. All of it hand-crafted Javascript, not a line of borrowed code or framework code.

My point was that the XmlHttpRequest API is kind of poor. It's a nice thing to have, especially now that it's been standardised across browsers, but the API -and the onreadystatechange method in particular- could have been better.
It's important to keep in mind what AJAX technology is and does:

AJAX technology allows you to retrieve data from the server, from a webpage, without reloading that webpage.

It's primary use is to spice up HTML forms, for example, to automatically look up the city and street when someone enters his postal code.


This means that it does not matter how your pages are built. You need two thing:
1) the final HTML you send to the client browser contains the necessary Javascript code to fire an Ajax request
2) your server has some servlet or script that can receive the ajax requests and send the response you need for your script to work
Here's a link to 2,010,000 pages that appear to have something to do with AJAX frameworks:

http://www.google.com/search?q=ajax%20framework

The first one is actually rather good.
At a glance, several. Take a look:

http://www.google.com/search?q=ajax%20jsp%20taglib
[ November 15, 2005: Message edited by: Barend Garvelink ]
You have several options, not all of which require XML.

1) Using responseText like you are now, you could have your server respond with a comma-seperated or newline-seperated list of values and parse that in your onreadystatechange method using String.split to chop it up into an array.

2) Alternatively (but somewhat deviant), you could have your server generate a bit of Javascript code and have your event handler call the eval-function on it.

3) Using XML, you'll have to have your server generate an XML response and parse that on the client side using responseXML and the standard DOM API. This may be "prettier" and all official and stuff, but it's a bit more work.

If there's no particular reason why you'd need XML (other than perhaps professional curiosity), I'd just go with option 1.
Mike, Nathaniel,


Are you aware of any compatibility quirks and look-out-for's between the XmlHttpRequest implementations of IE, Firefox, Opera and Safari (other than the constructor)? Does your book cover this topic?

Microsoft invented the XMLHttpRequest object into its browser first....



True. You can tell, cause any of the aforementioned companies would have had the decency to pass an event object passed into the onreadystatechanged handler, rather than to assume (force) you (to) keep everything in global scope like a VB programmer .
You can use the XmlHttpRequest to send a HTTP POST request. You set the HTTP Method to POST in the open(...) call, and then pass the form data into the send() call.




Notes:
- From your post, I'm not sure if you're familiar with the HTTP protocol. Glance over RFC 2616 if you don't know exactly what sets GET and POST requests apart. See http://www.w3.org/Protocols/rfc2616/rfc2616.html

- The string passed into the send method look just like a query string in a HTTP GET: it's "var=value&var=value&var=value".

- The example above would work for an actionform containing two fields: foo & baz.

- You have to url-encode the request contents. I probably got the capitalization wrong in the example. You may have to hit google for a bit.

- A "live HTTP headers" tool is invaluable in debugging these things. There's an extension for Firefox, and a seperate program for Internet Explorer. Of the latter, I don't remember what it's called, but it's often referred to on ieblog.

(edit)

- You may have to set some request headers before calling the send(...) method. See note #1.
[ November 15, 2005: Message edited by: Barend Garvelink ]
Struts is a server-side framework; the two don't get in eachothers way. Using AJAX in a portal environment can be tricky though.
I'm not sure there's a pattern expressly for this purpose. Obviously, constantly looking up each and everything in the HTML DOM is too awkward for the apparent complexity you're dealing with.

When I recently had an app of similar complexity, I took the MVC pattern to the client side. My form state was pure Javascript, and each object in it had the ability to write itself into the HTML DOM, setting up event handlers as needed. The javascript object graph was model and controller, the HTML DOM was view.
Setting the innerHTML property is a bit too basic for this purpose. You'll have to use the HTML DOM. There's a tutorial on w3schools:
http://www.w3schools.com/dom/default.asp

You can write a simple bubble-sort algorithm that manipulates the DOM tree directly, so that you don't even have to load the values into an array first. It's not beginner stuff, but I wouldn't exactly call it advanced material either. Shouldn't take you more than a day.