For this post i will use the responseText property to get the data return by the Ajax call. For this example i have used the northwind database and in that database i have used the two tables which are orders and the Employees table. I have used DropDownList control which is used to fill with the countries name from the order and i have used the distinct select statement to get the countries name from the order table. Next i have the div control which will show the detail of order which is get from the order table based on the country name. When use select the country name from the DropDownList then the detail of that country is display in the div control.
In the OrderDetail code behind file what did is to get the country name from the query string and then query the sql server to get the detail of the order based on the country name. For fetching the detail of the order based on the country name i have used the order table and also the employees table to get the employee name from that. Then after the successful of the sql query i have store the return values in the data reader object. and the loop through the data reader read() function call i have generate the html table which will be as it is shown on the client side.
After the return from the server in the onreadystatechange function , when the state of the request return 4 I have get the div control and then assign the xmlHttp.reponseText to the innerHTML property of the div control and the over loop is complete based on the DropDownList onchange event.
You can download the source code from here. you can read more about the responseText more by clicking here
All and any comments / bugs / suggestions are welcomed!