HTML and CSS Reference
In-Depth Information
NorthwindEntities1 db = new NorthwindEntities1();
var data = from item in db.Orders
join item2 in db.Order_Details on item.OrderID
equals item2.OrderID
where
item.CustomerID == settings.CustomerID
&&
item.OrderDate >= settings.StartDate
&&
item.OrderDate <= settings.EndDate
orderby item.OrderID ascending
select new { item.CustomerID, item.OrderID,item.OrderDate,
item2.UnitPrice, item2.Quantity };
return Json(data.ToArray());
}
GetOrders()
takes one parameter of type
OrderSettings
. The
OrderSettings
class's properties match
those of the JSON object being sent from the client. This way, ASP.NET MVC automatically maps incoming
JSON object to the
OrderSettings
class.
OrderSettings
looks like this:
public class OrderSettings
{
public string CustomerID { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
}
A LINQ to Entities query then selects all the
Order
and
Order Details
records with matching
CustomerID
and falling within the specified date range. The query returns a custom type that contains the
CustomerID
,
OrderID
, and
OrderDate
properties from the
Orders
table and the
Quantity
and
UnitPrice
properties from the
Order Details
table. The return type of
GetOrders()
is
JsonResult
. The
Json()
method
converts the query results into the equivalent JSON format.
That's it! You can now run the Order History view and test its functionality.
n
Note
While testing the Order History application, you may find that the worker thread completes too quickly if
the database is running on the local machine. For the sake of testing and confirming that the UI isn't blocked, you
can deliberately introduce some delay in the worker thread. As an alternative to adding a dummy
do
-
while
loop
that introduces delay, you can call the
postMessage()
method using the
setTimeout()
function, like this:
var t
= setTimeout(postMessage, 10000, xhr.responseText);
.
Summary
Traditional JavaScript code runs in the same thread as the UI. Due to this single-threaded nature, the UI is
blocked when JavaScript code is being executed. HTML5 web workers add multithreaded capabilities to
JavaScript. Using web workers, you can execute script files in the background. This way, the UI isn't
blocked while the script is running. Web workers can be a great help when a script is lengthy and long-
