Skip to main content

hide-column

Description

Fires when hiding a column

Usage

"hide-column": ({
id: string,
mode?: boolean,
eventSource?: string,
}) => boolean|void;

Parameters

The callback of the action takes an object with the following parameters:

  • id - (required) the ID of a column that is hidden
  • mode - (optional) if set to true, hides a column; if false, a column is shown
  • eventSource - (optional) the name of the Grid action that triggered hide-column

Returning false from the event handler will block hiding a column.

Example

<script>
import { getData } from "./common/data";
import { Grid } from "@svar-ui/svelte-grid";
import { Button } from "@svar-ui/svelte-core";
const { data, columns } = getData();

let api = $state();

const hideColumn = () => {
api.exec("hide-column", { id: "firstName", mode: true });
};
</script>

<Button onclick={hideColumn} type="primary">Hide</Button>

<Grid {data} {columns} bind:this={api} />

Related articles: