Skip to main content

close-editor

Description​

Fires when closing the inline editor

Usage​

"close-editor": ({
    ignore: boolean
}) => boolean|void;

Parameters​

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

  • ignore - (required) if set to true, the inline editor closes and the cell data is not updated; if false, the cell is updated

Returning false from the event handler will prevent updating data in a cell on closing the inline editor.

Example​

In the example below we output to the console the value of the ignore parameter of the close-editor action by applying the api.on() method:

<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("close-editor", ev => {
         console.log("The cell was updated:", (ev.ignore));
     });}

</script>

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

Related articles: