Super powerful GridView display based on JQuery's ajax_jquery

I saw an example like this and wanted to share it with you. This has always been what I wanted to do.
First show the final look:

Using northwind’s data. Clicking the plus sign in front will display other detailed orders belonging to this product, and each product will have its order number behind it. What it looks like after clicking ' ':

Let’s first analyze its implementation:

The display of the first picture is a Gridview. When you click the ' ' in front of each record, a Web Method will be called using jQuery's ajax function, and the ID of the current product will be transferred into it, and then a class that inherits UserControl will be defined. , it can add an ascx file, and then define a View State field in this class.

When each ' ' is clicked, jQuery is used to display the ascx file under the current product slideshow(). So how is the id passed? This uses View State.

There are many introductions about View State. I haven't used it much either. Here is a brief explanation of its relationship with a Web Control:

The following is your code:

This is the GridView of the product.

Then Web Method:

Control class:

CustomerOrder.ascx code:

The entire ajax code that calls Web Method: