Blazor Tree Grid Example - Observable Collection Binding
This sample demonstrates real-time observable data binding in the Blazor TreeGrid, enabling instant updates for any changes made to hierarchical support ticket data.
Ticket ID | Title | Category | Priority | Status | Assigned To | Customer | Created Date | Due Date |
|---|
| 57301 | Server Infrastructure Issues | Technical | High | In Progress | John Smith | Acme Corp | 10/01/2025 | 10/16/2025 |
| 57302 | Email Service Down | Technical | Critical | Open | John Smith | Acme Corp | 10/04/2025 | 10/16/2025 |
| 57303 | Database Connection Issues | Technical | High | In Progress | Sarah Johnson | Acme Corp | 10/05/2025 | 10/16/2025 |
| 57304 | Load Balancer Configuration | Technical | Medium | Resolved | John Smith | Acme Corp | 10/06/2025 | 10/17/2025 |
| 57305 | DNS Resolution Problems | Technical | High | Open | Mike Wilson | Acme Corp | 10/07/2025 | 10/17/2025 |
| 57306 | CDN Performance Issues | Technical | Medium | In Progress | Lisa Brown | Acme Corp | 10/08/2025 | 10/18/2025 |
| 57307 | Application Bug Reports | Software | Medium | Open | Mike Wilson | Tech Solutions | 10/02/2025 | 10/17/2025 |
| 57308 | Login Authentication Error | Software | High | Escalated | Mike Wilson | Tech Solutions | 10/03/2025 | 10/16/2025 |
| 57309 | Data Export Functionality | Software | Low | Open | Lisa Brown | Tech Solutions | 10/04/2025 | 10/19/2025 |
| 57310 | UI Rendering Issues | Software | Medium | In Progress | Mike Wilson | Tech Solutions | 10/05/2025 | 10/18/2025 |
| 57311 | API Integration Problems | Software | Critical | Open | Tom Davis | Tech Solutions | 10/06/2025 | 10/17/2025 |
| 57312 | File Upload Memory Leak | Software | High | In Progress | Sarah Johnson | Tech Solutions | 10/07/2025 | 10/17/2025 |
| 57313 | Session Timeout Bug | Software | Medium | Resolved | Lisa Brown | Tech Solutions | 10/08/2025 | 10/19/2025 |
| 57314 | Network Connectivity Problems | Network | Medium | Open | Tom Davis | Global Industries | 10/03/2025 | 10/17/2025 |
| 57315 | VPN Connection Timeout | Network | Medium | In Progress | Tom Davis | Global Industries | 10/04/2025 | 10/16/2025 |
| 57316 | Firewall Configuration | Network | Low | Resolved | John Smith | Global Industries | 10/05/2025 | 10/18/2025 |
| 57317 | WiFi Access Point Issues | Network | High | Open | Tom Davis | Global Industries | 10/06/2025 | 10/17/2025 |
| 57318 | Router Configuration Error | Network | Critical | Escalated | Mike Wilson | Global Industries | 10/07/2025 | 10/16/2025 |
| 57319 | Bandwidth Optimization | Network | Medium | In Progress | Sarah Johnson | Global Industries | 10/08/2025 | 10/20/2025 |
| 57320 | User Training Requests | Support | Low | Open | Sarah Johnson | StartUp Inc | 10/04/2025 | 10/21/2025 |
| 57321 | Password Reset Issues | Support | Medium | Resolved | Sarah Johnson | StartUp Inc | 10/05/2025 | 10/17/2025 |
| 57322 | Feature Request Training | Support | Low | Open | Lisa Brown | StartUp Inc | 10/06/2025 | 10/23/2025 |
| 57323 | New Employee Onboarding | Support | Medium | In Progress | Sarah Johnson | StartUp Inc | 10/07/2025 | 10/19/2025 |
| 57324 | System Access Training | Support | Low | Open | Tom Davis | StartUp Inc | 10/08/2025 | 10/21/2025 |
| 57325 | Advanced Features Workshop | Support | Medium | In Progress | Mike Wilson | StartUp Inc | 10/09/2025 | 10/18/2025 |
| 57326 | Hardware Maintenance | Hardware | Medium | Open | Mike Wilson | Enterprise Co | 10/05/2025 | 10/18/2025 |
| 57327 | Printer Configuration | Hardware | Low | Open | Tom Davis | Enterprise Co | 10/06/2025 | 10/17/2025 |
| 57328 | Server Memory Upgrade | Hardware | High | In Progress | Mike Wilson | Enterprise Co | 10/07/2025 | 10/17/2025 |
| 57329 | Workstation Replacement | Hardware | Medium | Closed | Lisa Brown | Enterprise Co | 10/08/2025 | 10/20/2025 |
| 57330 | UPS Battery Replacement | Hardware | High | Open | John Smith | Enterprise Co | 10/09/2025 | 10/17/2025 |
| 57331 | Network Switch Upgrade | Hardware | Critical | In Progress | Sarah Johnson | Enterprise Co | 10/10/2025 | 10/16/2025 |
| 57332 | Monitor Calibration | Hardware | Low | Resolved | Tom Davis | Enterprise Co | 10/11/2025 | 10/19/2025 |
| 57333 | Security Vulnerabilities | Security | Critical | Open | John Smith | SecureBank Ltd | 10/06/2025 | 10/16/2025 |
| 57334 | SSL Certificate Renewal | Security | High | In Progress | Sarah Johnson | SecureBank Ltd | 10/07/2025 | 10/16/2025 |
| 57335 | Access Control Review | Security | Medium | Open | Mike Wilson | SecureBank Ltd | 10/08/2025 | 10/21/2025 |
| 57336 | Penetration Test Findings | Security | Critical | Escalated | Lisa Brown | SecureBank Ltd | 10/09/2025 | 10/16/2025 |
| 57337 | Two-Factor Auth Setup | Security | High | In Progress | Tom Davis | SecureBank Ltd | 10/10/2025 | 10/17/2025 |
| 57338 | Compliance Audit Issues | Security | Medium | Open | John Smith | SecureBank Ltd | 10/11/2025 | 10/23/2025 |
| 57339 | Performance Optimization | Performance | High | Open | Lisa Brown | FastTech Corp | 10/07/2025 | 10/17/2025 |
| 57340 | Query Optimization | Performance | High | In Progress | Tom Davis | FastTech Corp | 10/08/2025 | 10/17/2025 |
| 57341 | Caching Implementation | Performance | Medium | Open | Lisa Brown | FastTech Corp | 10/09/2025 | 10/19/2025 |
| 57342 | Memory Usage Analysis | Performance | High | In Progress | Mike Wilson | FastTech Corp | 10/10/2025 | 10/17/2025 |
| 57343 | Load Testing Setup | Performance | Medium | Open | Sarah Johnson | FastTech Corp | 10/11/2025 | 10/18/2025 |
| 57344 | CDN Configuration | Performance | Low | Resolved | John Smith | FastTech Corp | 10/12/2025 | 10/21/2025 |
| 57345 | Backup System Issues | Backup | High | Open | John Smith | DataSafe Inc | 10/08/2025 | 10/16/2025 |
| 57346 | Daily Backup Failure | Backup | Critical | Escalated | Sarah Johnson | DataSafe Inc | 10/09/2025 | 10/16/2025 |
| 57347 | Recovery Testing | Backup | Medium | Open | Mike Wilson | DataSafe Inc | 10/10/2025 | 10/18/2025 |
| 57348 | Backup Storage Expansion | Backup | High | In Progress | Lisa Brown | DataSafe Inc | 10/11/2025 | 10/17/2025 |
| 57349 | Archive Policy Update | Backup | Medium | Open | Tom Davis | DataSafe Inc | 10/12/2025 | 10/19/2025 |
| 57350 | Disaster Recovery Plan | Backup | Critical | In Progress | John Smith | DataSafe Inc | 10/13/2025 | 10/17/2025 |
| 57351 | Mobile App Issues | Mobile | High | Open | Tom Davis | MobileFirst Co | 10/09/2025 | 10/24/2025 |
| 57352 | iOS App Crashes | Mobile | Critical | Escalated | Sarah Johnson | MobileFirst Co | 10/10/2025 | 10/16/2025 |
| 57353 | Android Push Notifications | Mobile | Medium | In Progress | Mike Wilson | MobileFirst Co | 10/11/2025 | 10/18/2025 |
| 57354 | App Store Deployment | Mobile | High | Open | Lisa Brown | MobileFirst Co | 10/12/2025 | 10/17/2025 |
| 57355 | Offline Sync Issues | Mobile | Medium | In Progress | Tom Davis | MobileFirst Co | 10/13/2025 | 10/20/2025 |
| 57356 | Mobile Performance Tuning | Mobile | Low | Open | John Smith | MobileFirst Co | 10/14/2025 | 10/22/2025 |
| 57357 | Cloud Infrastructure Issues | Cloud | High | Open | Sarah Johnson | CloudTech Solutions | 10/10/2025 | 10/18/2025 |
| 57358 | AWS Lambda Timeouts | Cloud | Critical | In Progress | Mike Wilson | CloudTech Solutions | 10/11/2025 | 10/16/2025 |
| 57359 | S3 Bucket Configuration | Cloud | Medium | Open | Lisa Brown | CloudTech Solutions | 10/12/2025 | 10/19/2025 |
| 57360 | Auto-scaling Issues | Cloud | High | Escalated | Tom Davis | CloudTech Solutions | 10/13/2025 | 10/17/2025 |
| 57361 | Container Orchestration | Cloud | Medium | In Progress | John Smith | CloudTech Solutions | 10/14/2025 | 10/21/2025 |
| 57362 | Kubernetes Deployment | Cloud | Low | Open | Sarah Johnson | CloudTech Solutions | 10/15/2025 | 10/23/2025 |
| 57363 | Integration Problems | Integration | Medium | Open | Mike Wilson | IntegraTech Inc | 10/11/2025 | 10/19/2025 |
| 57364 | Third-party API Failures | Integration | Critical | Escalated | Lisa Brown | IntegraTech Inc | 10/12/2025 | 10/16/2025 |
| 57365 | Webhook Configuration | Integration | High | In Progress | Tom Davis | IntegraTech Inc | 10/13/2025 | 10/17/2025 |
| 57366 | Data Synchronization Issues | Integration | Medium | Open | John Smith | IntegraTech Inc | 10/14/2025 | 10/20/2025 |
| 57367 | OAuth Authentication Setup | Integration | Low | Resolved | Sarah Johnson | IntegraTech Inc | 10/15/2025 | 10/22/2025 |
| 57368 | Database Management Issues | Database | High | Open | John Smith | DataCore Systems | 10/12/2025 | 10/17/2025 |
| 57369 | Index Optimization | Database | Medium | In Progress | Sarah Johnson | DataCore Systems | 10/13/2025 | 10/18/2025 |
| 57370 | Backup Corruption Recovery | Database | Critical | Escalated | Mike Wilson | DataCore Systems | 10/14/2025 | 10/16/2025 |
Add New Support Ticket
The TreeGrid uses an ObservableCollection to reflect hierarchical changes, including adding, resolving, escalating, or removing actions, directly in the UI as users interact with the ticket list. These interactive operations instantly update the display for seamless synchronization without manual refreshing.
In this demo, Add Ticket opens a dialog with three required fields: Category (from existing root tickets), Title (custom user input), and Priority. New tickets automatically inherit the category and customer from their parent.
Additional Actions: Mark as Resolved changes the selected ticket status to resolved; Escalate Ticket changes the status to Escalated and priority to Critical; and Delete Resolved Ticket removes only the selected ticket from the collection if it has a Resolved status.
Underlying collections must implement INotifyCollectionChanged and models should implement INotifyPropertyChanged for property-level notifications.