web
You’re offline. This is a read only version of the page.
close
Skip to main content
Community site session details

Community site session details

Session Id :
Power Pages - General Discussions
Suggested Answer

PCF Control: After `setFilter` and `refresh`, `updateView` Not Getting called in Powerpages

(1) ShareShare
ReportReport
Posted on by 14
Description:
I'm developing a Power Pages PCF control using Azure Maps to show data on a map and perform radius searches from user-entered locations. When selecting a dataset with a large number of data (e.g., 4250) in Power Pages:
Issue 1: updateView() doesn't get called again after executing refresh(), resulting in no data being loaded into the PCF’s context.
Issue 2: When loading records of next page via pagination the existing records in the context are removed. To improve performance, we implemented a custom function (setFilterFromContext) that uses setFilter() to retrieve data instead of fetchXML. This approach works well for smaller record sets but fails when the number of data exceeds 4250.
 
Questions:
1. Why doesn't updateView() get called after applying filters to a large number of data?
2. How can I ensure updateView() is called correctly after applying filters?
3. Is there a way to maintain previous pages of data in the context when using pagination?"
 
 
Any insights or workarounds would be greatly appreciated! 
 
Categories:
I have the same question (0)
  • Suggested answer
    Jerry-IN Profile Picture
    286 on at
    PCF Control: After `setFilter` and `refresh`, `updateView` Not Getting called in Powerpages
    Hello  ,

    Thanks for raising this question in Q&A forum! This is a common challenge with PCF dataset controls in Power Pages, especially when dealing with large datasets (4250+ records) and custom filtering/pagination logic.
     

    Why updateView() Doesn't Trigger After setFilter/refresh

    Power Pages PCF framework throttles updateView() calls for performance reasons with large datasets. When you call setFilter() followed by refresh(), the framework may optimize away the re-render if it detects no significant change in the dataset shape or property bag. This is particularly evident when bypassing standard FetchXML and using custom setFilterFromContext()—the context change isn't always propagated to trigger the lifecycle method
     

    Solutions to Force updateView()


    1. Use requestRender() as Primary Fix:

    typescript
    // After setFilter and refresh
    context.parameters.dataset.refresh();
    context.utils.requestRender();  // Forces re-render explicitly
    2. Trigger Property Change Pattern:
    Add a dummy bound property in your manifest (e.g., refreshTrigger: singleLine.Text) and toggle it:
    typescript
    context.parameters.refreshTrigger.setValue(new Date().toISOString());
    context.parameters.dataset.refresh();
    3. Dataset Paging Limits Workaround:
    For >4250 records, Power Pages imposes internal limits. Slice your data server-side or use:
    typescript
    // Load first page, then append subsequent pages manually
    if (context.parameters.dataset.paging.getPageNumber() === 1) {
        // Full refresh logic
    } else {
        // Append to cached data
    }
    Fix Pagination Data Loss
    Implement Client-Side Caching:
    typescript
    private cachedRecords: ComponentFramework.EntityRecord[] = [];
    public updateView(context: ComponentFramework.Context<IInputs>): void {
        const currentRecords = context.parameters.dataset.records;
        
        // Merge new page with cache (avoid duplicates by ID)
        this.cachedRecords = this.mergeRecordsWithoutDuplicates(
            this.cachedRecords, currentRecords
        );
        
        // Render from full cache
        this.renderMapWithAllRecords(this.cachedRecords);
    }
    private mergeRecordsWithoutDuplicates(existing: any[], incoming: any[]): any[] {
        const existingIds = new Set(existing.map(r => r.id));
        return [
            ...existing,
            ...incoming.filter(r => !existingIds.has(r.id))
        ];
    }
    Complete Working Pattern
    typescript
    public performRadiusSearch(latitude: number, longitude: number, radius: number): void {
        // Build filter dynamically
        const filter = this.buildRadiusFilter(latitude, longitude, radius);
        context.parameters.dataset.setFilter(filter);
        
        // Force framework to recognize change
        context.parameters.refreshTrigger.setValue(`refresh_${Date.now()}`);
        context.parameters.dataset.refresh();
        
        // Explicit render request
        context.utils.requestRender();
    }

    Additional Recommendations
    • Server-Side Paging: For 4250+ records, implement OData $top/$skip in your custom fetch to avoid client-side limits.
    • Debounce Filters: Add 300ms debounce to radius search to prevent rapid-fire refreshes.
    • Virtual Scrolling: For map markers, use clustering (Azure Maps supports this natively) instead of rendering all 4250+ pins.
    This approach resolves both the updateView() trigger issue and pagination data loss. Test with your 4250-record dataset—the requestRender() + property toggle combo works reliably in Power Pages.​ If this feels helpful kindly accept the answer.
     
    Best Regards,
    Jerald Felix

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Coming soon: forum hierarchy changes

In our never-ending quest to improve we are simplifying the forum hierarchy…

Ajay Kumar Gannamaneni – Community Spotlight

We are honored to recognize Ajay Kumar Gannamaneni as our Community Spotlight for December…

Leaderboard > Power Pages

#1
Jerry-IN Profile Picture

Jerry-IN 58

#2
Fubar Profile Picture

Fubar 46 Super User 2025 Season 2

#3
sannavajjala87 Profile Picture

sannavajjala87 31

Last 30 days Overall leaderboard