HTML and CSS Reference
In-Depth Information
for (var i = 0; i < data.length; i++) {
if (data[i].OrderID != currOrderId || i == (data.length - 1)) {
if (i == (data.length - 1)) {
orderAmount += (data[i].Quantity * data[i].UnitPrice);
}
finalData.push({ CustomerID: data[i].CustomerID,
OrderID: currOrderId,
OrderAmount: orderAmount,
OrderDate: data[i].OrderDate });
currOrderId = data[i].OrderID;
orderAmount = 0;
}
orderAmount += (data[i].Quantity * data[i].UnitPrice);
}
postMessage(finalData);
}
}
var param = JSON.stringify(settings);
xhr.send(param);
}
This code attaches an event handler for the web worker's
message
event. The event-handler function
ReceiveMessageFromPage()
calls another function,
GetOrders()
. Recollect that the view passes a JSON
object containing a customer ID and a date range to the worker thread. This JSON object is obtained using
the
evt.data
property and passed to the
GetOrders()
function.
GetOrders()
creates a new instance of
XMLHttpRequest
and opens a POST request with a controller
action method (
Home/GetOrders
). The
Content-Type
header is set to
application/json
because the data
being sent as a part of the request is in JSON format.
The
onreadystatechange
event-handler function checks the
readyState
property of the
XMLHttpRequest
object. If
readyState
is
4
(meaning the request is complete), it processes the returned data.
The value of the
responseText
property is converted into JSON format using the
JSON.parse()
method. A
for
loop iterates through the order data and calculates the total amount for each order. It does so by
multiplying the
Quantity
and
UnitPrice
values.
Based on the processing result, a JSON object is constructed with four properties:
CustomerID
,
OrderID
,
OrderDate
, and
OrderAmount
. This order data is stored in an array—
finalData
—using the
push()
method.
Finally, the
postMessage()
method is invoked on the web worker to send the
finalData
array to the page.
Before the request is initiated, the JSON settings are converted into their string equivalents using the
JSON.stringify()
method. The
send()
method makes the request and passes the settings to the
GetOrders()
action method.
GetOrders() Action Method
The
GetOrders()
action method resides in the HomeController and returns order data for a specific
customer ID and date range.
GetOrders()
is shown in Listing 10-13.
Listing 10-13.
GetOrders()
Action Method
[HttpPost]
public JsonResult GetOrders(OrderSettings settings)
{
