This topic describes how to refresh a list in a Table of Records without refreshing the whole page by using Ajax. You may need to refresh the widget when the content is outdated with its source, and to update it without interfering with the display and behavior of the page the Ajax technique is the way to accomplish it.


In this example we have a list of computers and we want to refresh the Table Records widget. Our goal is to refresh only the widget without need to refresh the entire page.

  1. Create a screen with a query in the preparation screen action to fetch the records from the Computer entity;
  2. Place a Table Records widget in the screen and set the source record list to be the query in the preparation. Name the widget 'ComputerTable'. Later, you will need to reference this widget by its name;
  3. Create a screen action and name it 'RefreshComputerTable';
  4. Insert a button on the screen bound to the screen action created in the last step with the method property 'Ajax Submit';
  5. On the 'RefreshComputerTable' screen action, refresh the preparation query using the Refresh Data tool. This ensures all recent changes are fetched from the database;
  6. Next to the refresh data tool, add an Ajax refresh. Set its “Widget” property to 'ComputerTable', the name of the table records widget created in step 2.


Check the How to Design Screens with Ajax sample at OutSystems Forge to view this example in action.

See also

Refresh Page Parts Using Ajax