How to add DYNAMIC breadcrumbs on a table data widget ?

[Karinush]

Hello is there any way to use the widget of data table and put breadcrumbs in it ? 

like in the backend ? 

i want the user to be able to filter by the fields and values that he want 

thanks!

[Mahnoor_Azhar]

Hey,

If you are looking for frontend solution there are some findings hopefully it helps you

1. Dynamic Breadcrumbs: Implement a dynamic navigation system that updates the breadcrumbs based on the user's current filter selections. This involves manipulating the breadcrumb trail when users choose filters and displaying specific levels depending on the active filters. JavaScript libraries like Vue.js or React can facilitate this with reactive techniques.
2. Breadcrumb Filtering: Build breadcrumbs as interactive filter elements. Each breadcrumb level could represent a filtered category or value. Clicking a breadcrumb could remove that filter or navigate to a higher level in the hierarchy. This provides intuitive context and control over the filtered data.
3. Separate Breadcrumb Component: Use a dedicated breadcrumb component alongside the data table. This component would update based on filters and offer navigation options separate from the table itself. Libraries like React Breadcrumbs or Material UI Breadcrumbs can provide pre-built components for easier implementation.

[Karinush]

how can i implement the breadcrumbs inside the OOB data table widget ? 

[Joe B2 · Accepted solution]

Yes, this is possible when setting the table up from the server script using the show_breadcrumbs and enable_filter parameters. An example:

data.incident_list = $sp.getWidget("can-widget-data-table", {
            table: 'incident',
            window_size: listSize,
            keywords: '', // This parameter is used to query the 123TEXTQUERY321 field
            filter: securityIncFilter,
            //fields:'number', // This is not nessecary as fields displayed are dictated by the view
            //hide_header: true,		
            view: 'default',
            o: 'name',
            d: 'asc',
            p: 1,
            show_breadcrumbs: true,
            enable_filter: true
        });

[Karinush]

Its working! thank you !!! 🤓