Passing Complex Data Types in ASP.NET Ajax | 3 | WebReference

Passing Complex Data Types in ASP.NET Ajax | 3

By Joydip Kanjilal


The partial-page rendering feature in Ajax is great. You can use it to refresh only a portion of your Web page rather than the entire page, which improves the application's overall responsiveness. Reduced consumption of server resources is yet another benefit of Ajax partial-page rendering.

If you use ASP.NET Ajax, however, it's quite tricky to pass complex data types. This article discusses the strategies you can follow to pass complex data using ASP.NET Ajax.

The two ASP.NET controls that you must know to implement Ajax are ScriptManager and UpdatePanel. The ScriptManager control is the brain of an Ajax-enabled Web page. To implement partial page rendering, you should set the EnablePartialRendering property of the ScriptManager control to true.

The UpdatePanel control facilitates partial-page rendering in Ajax enabled ASP.NET Web pages.

Pass Complex Data Using ASP.NET Ajax

A complex data type is a composite of other data types. In essence, it is a user-defined data type that contains one or more data types. The IBM online documentation on complex data types defines them as follows: "A complex data type is usually a composite of other existing data types. For example, you might create a complex data type whose components include built-in types, opaque types, distinct types, or other complex types. An important advantage that complex data types have over user-defined types is that users can access and manipulate the individual components of a complex data type."

Passing complex data types in Ajax is a bit tricky. We normally pass string objects back and forth between a server and a client when using ASP.NET Ajax. To pass complex data types, we need to use JSON (JavaScript Object Notation), the lightweight text-based open standard for data exchange. You can use JSON format to serialize and transfer data over the Web. You can use the toJSONString() method in JavaScript to convert any type to its corresponding JSON equivalent. The following code snippet illustrates this:

Consider the following Customer class:

The following code listing shows what your Web service class would look like:

In the code listing above, we added the following two lines to let the runtime know that we would like to use scripts to call the Web Service.