A Method for Providing User Interface Consistency in an AJAX-based Web Application Without Inhibiting Interactivity
Original Publication Date: 2009-Feb-10
Included in the Prior Art Database: 2009-Feb-10
AbstractA method is provided for creating a web-based user interface that maintains a high level of interactivity while providing data consistency across a set of multiple, asynchronously updated, panes. Interactivity is maintained by allowing asynchronous server requests to be submitted even if a response from a previous, long-running request is pending. However, if the results of the server requests are simply allowed to be rendered into the interface panes as soon as they are returned, the data displayed could be inconsistent, since one set of panes might contain results from an older request while others might contain results from a newer request. This inconsistency can be prevented by tagging related asynchronous server requests with a unique identifier that can then be used to identify the corresponding responses when they are returned. Only those responses tagged with the most recent, cached, identifier will be used for rendering data to the UI.
A Method for Providing User Interface Consistency in an AJAX -based Web Application Without Inhibiting Interactivity
Consider a web-based user interface consisting of the following set of UI panes and buttons:
In a modern web application, pressing the submit button will result in client-side creation of an AJAX request for each pane. Each AJAX request will be sent to the server and will be processed asynchronously by a server-side request processor. The results for each request will be sent back to the client as soon as they are ready. In order to keep the web application as interactive as possible, the submit button must remain active even if one or more of the AJAX responses is still pending. But if there are long-running AJAX requests that have yet to produce results, and a new request is submitted, data inconsistency can result in the UI, as partial results from an older request may be intermixed with partial results from a newer request. This could prove very confusing to a user and even result in misinterpretation of data. This can be prevented as follows:
When the submit button is pressed, the client application creates a unique tag (using a UUID or similar scheme) that will be cached in client-side storage. This tag will represent the latest request sent to the server. An HTTP request parameter containing the tag value will be added to...