Skip to main content

onsave

Description​

Fires when a user requests to save data in the editor

Usage​

onsave?: (ev: {
  changes: { [key: string]: any };
  values: { [key: string]: any };
}) => void;

Parameters​

The callback of the event takes the ev object with the next parameters:

  • changes – (required) a map of fields that were changed with their new values
  • values – (required) a map of current changed values (unsaved changes)

Example​

Handling save request​

<script>
  import { Editor } from "@svar-ui/svelte-editor";
  import { getData } from "../data";
  
  const { items, values } = getData();
  
  function onsave(ev) {
    console.log("modified fields: ", ev.changes.join(", "));
    console.log("latest data values", ev.values);
  }
</script>

<Editor {items} {values} {onsave} />

Details​

If autoSave: true, the event is triggered automatically on every field change.

If autoSave: false, the event is triggered only when the Save button is clicked, and only if there are actual data changes.

note

If the editor has validation rules and validation fails for any field, the onsave event will not be triggered.