Skip to main content

move-item

Description​

Fires when moving a row

Usage​

"move-item": ({ 
    id: string | number,  
    target?: string | number, 
    mode?: "before" | "after" | "up" | "down", 
    inProgress?: boolean,
    eventSource?: string, 
}) => boolean|void;

Parameters​

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

  • id - (required) the id of a row that is moved
  • target - (optional) the id of a new row where your row is moved
  • mode - (optional) the location where your row is moved:
    • "before" - before the target row
    • "after" - after the target row
    • "up" — move one position up
    • "down" — move one position down
  • inProgress - (optional) defines if the process of moving is still in progress (true) or completed (false)
  • eventSource - (optional) the name of the Grid action that triggered move-item

Example​

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

    function init(api){
        api.on("move-item", (ev) => {
            console.log("Row that is moved:", ev.id);
        });
    }
</script>

<Grid {data} {columns} {init} reorder />

Related articles: