HTML and CSS Reference
In-Depth Information
EXPLANATION
1
The JavaScript eval() function evaluates and/or executes a string of JavaScript
code. First, eval() determines if the argument is a valid string, i.e., the JSON string
that was returned from the server. Then eval() parses the string. The string re-
turned from the eval() is a JavaScript object.
2
The variable details will hold the properties and values of the JavaScript object.
3
JavaScript's special f or/in loop provides a mechanism for stepping through all the
properties of an object. It iterates through the carObject , retrieving both properties
and values to be placed in the div container on line 8.
If the property is “owner”, it has a nested set of key/value pairs as shown here:
{ "make":"Honda Civic",
"year":2006,
"price":18000,
"owner":{
"name":"Henry Lee",
"cellphone": "222-222-2222",
"address":{"street": "10 Main",
"city": "San Francisco",
"state": "CA"
}
},
"dealer": "SF Honda"
}
The special for/in loop iterates through the object's properties. To get the value of
a property, the property is placed between square brackets (associative array) pre-
ceded by the name of the object. In a nested object, the dot syntax is used to get
to the nested property as: carObject[“owner”].name or carObject[“owner”].ad-
dress.street.
4
Each time through the loop, a property and its value will be added to the details
variable until all properties/values have been collected. In this example, the ad-
dress was not included, only to keep the program size smaller.
5
The DOM's innerHTML property will be assigned all of the details collected for the
carObject and placed in the div container on line 8, Figure 18.20.
6
When the user clicks this button, the makeRequest() function will be called to cre-
ate an Ajax request object and handle the JSON data (see page 840).
7
This is the div container where the display data will be placed. The results is
shown in Figure 18.20.
Search WWH ::




Custom Search