Forms commonly have multiple data controls; the most typical example is a single master child layout. For example a main FormView control containing the order header, and a linked ListView control with the associated orderline details.
Below we show an example of the ListView control with the orderline details.
On this type of form, when you press a button to edit, insert or delete a record in the ListView you will see your page being refreshed before you are then able to for example start typing into the record you are editing. In addition to the screen appearing to flicker, you may also have to scroll the page to get back to the line you were editing.
AJAX (shorthand for Asynchronous JavaScript and XML) is a clever technology that can be easily added to your pages that will remove the flicker and improve performance.
As much has been written on the Internet regarding Ajax, this article will simply focus on how to use this in a site that uses master pages.
If you are using master pages, then the ScriptManager tag is required in the master page after the existing form tag.
|
<form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> . |
Then on individual pages two tags are added around each of the data controls that will require a partial refresh.
For example on the orders page, we use the following :-
|
<asp:UpdatePanel ID="UpdatePanel2" runat="server"> <ContentTemplate> <div> .. ListView control </div> </ContentTemplate> </asp:UpdatePanel> |
This means that not only does the screen do a partial refresh that is faster and reduces screen flicker, but also there is no need to scroll back to where you were.
Using Ajax significantly improves a users experience when interacting with data by greatly improving performance, reducing screen flicker and maintaining the users position on a page.
by Andrew Couch Office Access MVP, Director ASC Associates
andy@ascassociates.biz