Conference App: search presentations¶

Add live filtering to the Presentation list from Complete the application. The Relations and Constraints reference explains the reusable constraint pattern used here. Add the filter constraint, server-input form, and list refresh behavior without changing the existing relationship bindings.

Before you begin: Complete Complete the application.

Step 1 — Add the Presentation filter¶

Inside the existing oPresentationDD, after its Room and Presenter parent servers, add a filter property and OnConstrain procedure. The property stores the current search text; OnConstrain limits Title only when the text is non-empty.

Property String psFilter ""

Procedure OnConstrain
    String sFilter

    Get psFilter to sFilter
    If (sFilter <> "") Begin
        Constrain Self.Title contains sFilter
    End
End_Procedure

Step 2 — Add the server-input form¶

After the existing Presentation view properties and before the responsive layout/list, add the search form. pbServerOnInput True sends each edit to the server so the list can rebuild its constraints immediately.

Object oSearchFrm is a cWebForm
    Set piColumnSpan to 0
    Set psLabel to "form"
    Set pbServerOnInput to True
    Set pbShowLabel to False
    Set psPlaceHolder to "Type to search..."
End_Object

Step 3 — Refresh and highlight matching rows¶

Add OnInput inside oSearchFrm. It stores the typed value in the Presentation DDO, sends RebuildConstraints to ask that DDO to rebuild its constrained query, locates the current row in the list buffer, and highlights matching text in the title column. The filter changes which records the bound list receives; it does not copy records into a separate search collection.

Procedure OnInput Boolean bIsInsert String sInputType
    String sVal

    WebGet psValue to sVal
    Set psFilter of oPresentationDD to sVal

    Send Rebuild_Constraints of oPresentationDD
    Send FindDDRecordInBuffer of oList

    WebSet psHighlight of oPresentationDD_Title to sVal
End_Procedure

Add this procedure before the End_Object of oSearchFrm, after its existing properties.

Verify live filtering¶

Synchronize, open Presentations, and type a substring from a known title. Only matching rows remain and matching title text is highlighted. Clear the form to restore every row.

Checkpoint: Type, confirm the filtered rows and highlighted title, then clear the form and confirm all rows return.

Summary — What this sample demonstrates¶

This sample demonstrates that you can build a WebAssembly-based application around a REST API. DataFlex entities and data dictionaries mirror the API response shapes; cHttpClient downloads the data into the application.

The built-in cDbSqliteDriver stores that data in an on-device SQLite database through the application's connection. After synchronization, the database provides a full offline cache, demonstrating that a WebAssembly application can continue working with its downloaded data without a network connection.

Next¶

Conference App sample overview · Upstream reference implementation · Data references · Tutorials