3.5.
Fig. 3.5 Creating a Catalog Entry
58 3 Less JavaScript with Prototype
A new catalog entry gets created.
3.5 Updating a DOM Element with Ajax.Updater
The prototype library provides another class, Ajax.Updater to update a
DOM element??™s contents with the HTML from an XMLHttpRequest
response. As an example we shall update the validationMessage
element in the input form with HTML response from the server using the
Ajax.Updater class. Create an Ajax.Updater object and specify the
DOM element to update, the servlet url, and options parameters as shown
below.
function validateCatalogId(){
var catalogId=$F('catalogId');
var url = 'validateForm';
var pars ='catalogId='+catalogId;
var ajaxRequest = new Ajax.Updater
('validationMessage',
url,
{
method: 'get',
parameters: pars
});
}
Replace the validateCatalogId function in input.js in Ajax web
application with the validateCatalogId function that has the
Ajax.Updater class object to send the Ajax request. If an
onComplete function is specified the function gets invoked after the
DOM element specified to be updated has been updated. Also modify the
FormValidationServlet servlet to generate a text response with
which the validationMessage div??™s contents are to be updated with.
In the FormValidationServlet servlet, replace the if-else block
that generates the Ajax response with the following code.
if (rs.next()) {
out.
Pages:
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72