AJAX

Page 1

1


2


3


4


5


6


7


8


9


Note: 1. First Example: Consider you are reading from a text file and the response from server is in text format. 2. Second Example: Consider you are reading from an XML file and the response from server is in XML.

10


11


12


Note: 1. The div section will be used to display information returned from a server. 2. The button calls a function named loadXMLDoc(), if it is clicked

13


14


15


16


17


18


19


Note: 1. The image shows the functionality of the client-based Microsoft Ajax Library, which includes support for creating client components, browser compatibility, and networking and core services.

2. The image also shows the functionality of server-based Microsoft Ajax features, which include script support, Web services, application services, and server controls.

20


21


22


23


1. This example shows a two labels have been used to display current date-time on the page. 2. One label is inside and another is outside of UpdatePanel control 3. When you view this page in browser, you will find that, the time displayed on the label inside the UpdatePanel control is getting updated as soon as you click the button (which is also placed inside the UpdatePanel), whereas, the time on the label outside the UpdatePanel is not. 4. The button event handler does not have any code. It is used here to cause postback. 5. Then also when the button is clicked, then the whole page data is submitted to the server, but only the label data in the UpdatePanel gets updated.

24


1. In this case the Button control is outside the UpdatePanel. So, if the button is clicked then both the label data will be updated. But if you 2. But you can use Triggers and AsyncPostBasckTrigger control inside the trigger, inside UpdatePanel control.

3. AsyncPostBack control has two properties: 1. Control ID: The ID of the control, situated outside the UpdatePanel control, whose event will trigger the updation of control data present inside the UpdatePanel control. Here, the ID of the Button control (btnClick) has been passed to indicate that an event of this control will cause updation of Label control data inside the UpdatePanel control. 2. EventName: The name of the event of the control, situated outside the UpdatePanel control, which will actually trigger the updation of control data present inside the UpdatePanel control. Here, the event name of the Button control, i.e., Click has been passed to indicate when Click event of the Button control will be fired, then the Label control data in the UpdatePanel control is updated.

25


26


27


28


29


Note: 1. The example shows one UpdateProgress control that shows update status for two UpdatePanel controls 2. Thread.Sleep() method has been used just to cause a time delay to so the progress

30


Note: 1. The Timer control is a server control that embeds a JavaScript component into the Web page. 2. The JavaScript component initiates the postback from the browser when the interval that is defined in the Interval property has elapsed. 3. You set the properties for the Timer control in code that runs on the server and those properties are passed to the JavaScript component.

31


Note: 1. When the Tick event of Timer control is fired in every 3 seconds, the image of banner changes in Imgae control in UpdatePanel.

32


33


34


35


36


37


38


39


Notes: 1. You can also create custom ASP.NET server controls that include Ajax client behaviors. Custom controls that enhance the capabilities of other ASP.NET Web controls are referred to as extender controls.

40


41


42


43


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.