Display Data Tables in a Portal
  • 16 Nov 2023
  • 2 minute read
  • Dark
    Light
  • PDF

Display Data Tables in a Portal

  • Dark
    Light
  • PDF

Article Summary

Prior to using this functionality, it is necessary to understand the fundamentals to creating a portal, such as a Custom Applicant Status Portal

The Application Status Portal and other portals can be customized in a variety of ways. Liquid looping is used to display multiples of items on the portal, such as a table of test scores, sports the applicant has been recruited for, etc.

  • The Table View widget can also be used to construct paginated tables.

  • Only one Table View Widget can be used per view. If multiple tables are needed for a view, please follow the steps below using static content blocks. 

Create the method

  1. Select New Method.

  2. Enter the following Method configurations:

    • Status - Set the status to Active.

    • Name - Provide a descriptive name, such as Test Score Table.

    • Type - Set the type to GET.

    • View - Select the Application Status Page.

    • Output Type - Set the output type to Default Branding.

  3. Click Save.

  4. Click Create New Query.

  5. Enter the following Query configurations:

    • Name - Provide a descriptive name, such as Test Scores.

    • Population - The query base should be the item to be displayed. For this example, select the Test Scores query base to pull one row per test score.

  6. Add exports

    • Add the exports to be used as merge fields in the Portal View. We recommend updating the export label to be lowercase and use underscores instead of spaces.

  7. Add Filters

    • Test Status - Include the Test Status to display verified test scores received.

    • Portal Identity - When using a query base that is not Applications for the Applicant Status Portal, the Portal Identity filter will need to be adjusted. 

      data_table_sql_filter.png
      In this case, the [record] on [test] is the [person] on the [application] table. The filter has been updated to make the appropriate connections.

  8. Click Edit Parameters.

  9. This query must have a value for Output Node. We recommend naming it something intuitive. For example, if displaying a list of test scores, call the node test_scores.

Add merge Fields to the View

Add the merge fields to the Portal View using Liquid looping.

  1. Select the appropriate view.

  2. Drag in a static content block.

  3. Build a table with columns for the different data points to be displayed.

    • In the Source code, add in Liquid markup to loop through the results.

Note how the Liquid markup refers to the node of the Portal Query and each merge field is prefixed with "result."

<tbody>{% for result in test_scores %}
<tr>
<td>{{result.test_date}}</td>
<td>{{result.test_type}}</td>
<td>{{result.test_total}}</td>
</tr>
{%endfor%}
</tbody>

If only displaying verified test scores, we recommend using the 'Has Verified Test Score' filter to only show this table to applicants with verified test scores to display.

part.png

Test the Portal

To test, impersonate a test applicant and ensure that the table and test scores appear as desired.

welcome.png


Was this article helpful?

What's Next