PC SOFT

ONLINE HELP
 WINDEV, WEBDEV AND WINDEV MOBILE

Home | Sign in | English EN
  • Overview
  • Two methods can be used to manage the browser "Back" button
  • Example of desynchronization
  • Preventing from using the "Back" button
  • Operating mode
  • Implementation
  • Managing the synchronization
  • Overview
  • Default synchronization
  • Synchronization by programming
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Others
Stored procedures
14. Managing the "Back" button in practice
Previous pageTable of contentsNext page
Overview
The browser "Back" button allows the Web users to display the pages that have already been visited.
In a WEBDEV site in Session mode, each HTML page displayed on the browser is associated with a page context, found on the server. Each action performed in a page displayed by the browser must trigger an identical action on the corresponding page context found on the server.
However, the browser "Back" button is used to perform an action on the browser only: the page displayed in the browser and its context found on the server can be desynchronized when using the browser "Back" button.

Two methods can be used to manage the browser "Back" button

To avoid any out-of-sync problems between the pages displayed on the browser and the corresponding contexts found on the server, WEBDEV proposes two methods for managing the browser "Back" key:
  • Solution 1: Prevent from using the browser "Back" button to go back to this page.
    If the browser "Back" button is used to display the previous page, this action will have no effect.
    For more details, see: Prevent from using the browser "Back" button.
  • Solution 2: Managing the synchronization (default solution)
    For each action performed in a page from the browser, a synchronization test is automatically run between the HTML page and its context.
    Two modes can be used to manage the synchronization:
    • default synchronization (mode used by default when creating a new page).
    • programmed synchronization.
For more details, see: Managing the synchronization.

Example of desynchronization

Let's see a site example:
  • A browser page contains a browsing Table control linked to the ITEM file and a "Next" link.
  • The ITEM file contains a single item, each record includes a letter of the alphabet.
  • The page is used to display 6 rows of the Table control, the "Next" link is used to display the next 6 rows.
When opening the page, the Table control displays the 6 first records of the file (from 'A' to 'F'). Let's see the sequence of actions performed by the user:
  1. Click on the "Next" link
    Result: the server is positioned on the next 6 records of the ITEM file and returns their contents to the browser. The browser displays the next page of the Table control with the 6 new contents ('G' to 'L').
  2. Click on the browser "Back" button
    Result: the browser displays the page preceding the first action. The Table control displayed contains the letters 'A' to 'F'. The server was not contacted, therefore it is still positioned on the records 'G' to L'.
  3. Click on the "Next" link
    Result: the server is positioned on the next 6 records of ITEM ('M' to 'R'). The browser is synchronized with the server and it displays the same elements: the Web user has the feeling that some information is missing.
This behavior can have unexpected consequences when modifying a file record (modification of a record other than the one viewed by the Web user for example).
Reminder: each action on the browser must trigger a server action: the server sends a response to the browser. The click on the browser "Back" button being a browser action independent of your WEBDEV site, the second condition may not be performed.
Preventing from using the "Back" button
If the browser "Back" button is used to display the previous page, this action will have no effect.

Operating mode

Disabling the "Previous page" feature of the browser inserts the following Javascript code into the generated HTML page:
<SCRIPT LANGUAGE="JavaScript">
history.forward()
</SCRIPT>
When running the page in a browser, it will not be possible to go back to this page by using the "Back" button.
Remarks:
  • Clicking the browser "Back" button can make the page blink.
  • This mechanism can fail if a click of the "STOP" button is run before the forward() statement is run by the browser.

Implementation

To disable the browser "Back" button for a specific page:
  1. Open the page description window: on the "Page" pane, in the "Description" group, click "Description".
  2. In the "UI" tab, for "Using the browser "Back" button", select "Forbidden".
  3. Validate.
To disable the browser "Back" button for all the project pages:
  1. Open the project description: on the "Project" pane, in the "Project" group, click "Description".
  2. Click on the "Advanced" tab.
  3. For "Default option for the browser "Back" button", check "Forbidden".
  4. Validate. This option will be automatically taken into account for all new site pages.
Managing the synchronization

Overview

For each action performed in a page, the mechanism for page synchronization automatically checks the synchronization. This check consists in verifying whether the page displayed in the browser corresponds to the page context found on the server.
Two modes can be used to manage the synchronization:
  1. Default management of synchronization.
  2. Management of synchronization by programming, in the synchronization code of the page.

Default synchronization

The synchronization mechanism is triggered only if the option "Use the mechanism for synchronizing pages" is selected for the page.
If a desynchronization occurs, a warning message informs the Web user that the requested action has not been performed. The page corresponding to the context on the server is re-displayed. The site can continue to operate.
To implement the management of the synchronization in a page:
  1. Open the page description window: on the "Page" pane, in the "Description" group, click "Description".
  2. In the "UI" tab, for "Using the browser "Back" button", select "Allowed (runs the synchronization code)".
  3. Validate. This page will be automatically included in the history of browser pages: to go back to this page, click the browser "Back" button.
To implement the management of synchronization in all the project pages:
  1. Open the project description: on the "Project" pane, in the "Project" group, click "Description".
  2. In the "Advanced" tab, for "Default option for the browser "Back" button", check "Allowed (runs the synchronization code)".
  3. Validate. The project pages will be automatically included in the history of browser pages: to go back to these pages, click the browser "Back" button.
Remarks:
  • This management mode requires no specific WLanguage code.
  • The synchronization mechanism can be disabled for the page controls that do not require a management of synchronization ("Close" button for example): simply uncheck "Call page synchronization process if the user has used the browser "Previous" button" in the "Advanced" tab of the control description.
  • The warning message can be customized (see next paragraph).
Synchronization by programming
To manage the synchronization by programming:
  1. Open the page description window: on the "Page" pane, in the "Description" group, click "Description".
  2. In the "UI" tab, for "Using the browser "Back" button", select "Allowed".
  3. Configure (if necessary) the page controls for which the synchronization must not be managed.
    For each control that triggers an action on the server, you can specify whether the page synchronization must be managed (default option) or ignored during this action. To ignore the synchronization management, simply uncheck "Call the page synchronization process if the user pressed the browser Back button" in the "Advanced" tab of the control description.
  4. Enter the code required for custom management of synchronization in the page synchronization code. Use ChangeAction in the page synchronization code. This function is used to define the action that will be performed if the page is desynchronized.
Remarks:
  • ChangeAction is initialized with "No action" if a WLanguage function that allows displaying or re-displaying a page is used in the page synchronization code.
  • To customize the desynchronization message, all you have to do is enter in the synchronization code of the page:
    1. the custom message.
    2. the re-display of the current page on the server (with PageRefresh for example).
  • To perform a synchronization from the information found on the computer of the Web user, we recommend that you:
    1. Use a hidden control containing the identifier of the displayed and selected record.
    2. In the synchronization code, find the current record on the browser. This search is performed from its identifier found in the hidden control.
    3. Refresh the page.
Previous pageTable of contentsNext page
Comments
Click [Add] to post a comment