Skip to main content

editor

Description

Fires when changing a value in the table via the inline editing

Usage

"editor": ({
value: any
}) => boolean|void;

Parameters

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

  • value - (required) a new value

Returning false from the event handler will prevent changing a value via the inline editor.

Example

<script>
import { Grid } from "@wx/svelte-grid";
import { getData } from "./common/data";
const { data } = getData();

const columns = [
{ id: "id", width: 50 },
{ id: "city", header: "City", editor: "text", width: 160 },
{
id: "email",
header: "Email",
editor: "text",
width: 250,
css: "center",
},
];

let api;

$: if (api) {
api.on("editor", (ev) => {
console.log("A new value:", ev.value);
});
}
</script>

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

Related articles: