open-filter

Description

Fires when a filter is activated for a field

Usage

"open-filter": ({
    id: string | null,
    area?: "values" | "rows" | "columns"
}) => boolean | void;

Parameters

The callback of the action takes the next parameters:

• area - the area where a field is applied ("rows", "columns", "values")
• id - the id of a field; if there's a single id argument with null value, the filter will be closed.

info

For handling the inner events you can use the Event Bus methods

Returns

The function may return either a boolean value or void. When it returns false, the event operation in question will be halted.

Example

The example below shows how to make the Configuration panel hide upon closing the filter box:

const table = new pivot.Pivot("#root", {
    fields,
    data: dataset,
    config: {
        rows: ["studio", "genre"],
        columns: [],
        values: [
            {
                field: "title",
                method: "count"
            },
            {
                field: "score",
                method: "max"
            }
        ]
    }
});

table.api.on("open-filter", (ev) => {
    if(!ev.id) {
        table.api.exec("show-config-panel", {
            mode: false
        });
    }    
});

In the next example we output to console the id of the field for which filter is activated:

const table = new pivot.Pivot("#root", {
    fields,
    data,
    config: {
        rows: ["studio", "genre"],
        columns: [],
        values: [
            {
                field: "title",
                method: "count"
            },
            {
                field: "score",
                method: "max"
            }
        ]
    }
});

table.api.on("open-filter", (ev) => {
    console.log("The field id for which filter is activated:", ev.id);
});