---
title: "Batch Editing | Feature"
description: "ZingGrid can edit, insert, and remove rows quickly through batch editing."
url: https://www.zinggrid.com/docs/features/batch-editing
---

```text
experiment_id: web-retrieval-v1
fixture_id: /docs/features/batch-editing.md
mode: provenance
representation: markdown
origin_response_id: a11c20fa8ed01c41df2d7ff324e3184d
version: 2026-10-21
version_created_at_utc: 2026-10-21T20:42:35.673Z
version_nonce: 9ea5baf38e1e841f5d8565b4800279da
generated_at_utc: 2026-11-08T23:36:15.737Z
response_nonce: 5351e03b9180b6c3b78b926fdad7481c
```

# Batch Editing

ZingGrid has the ability to apply batch edits, which allows editing, inserting, and removing multiple rows quickly.
Enable this feature by adding the `batch-edit` attribute to your grid.

## Enabling Batch Edit

Enable batch editing by setting the `batch-edit` and `editor` attributes on the `<zing-grid>` tag (see below).
The addition of the attribute will include the batch edit controls on the left of control bar.

To make batch edits, click the "batch edit" button on the control bar.
In batch edit mode, a new set of controls (save and discard) will replace the "batch edit" button, and the editable cells are outlined.

Once in batch edit mode, make any amount of edits to the grid.
Note that cells that are part of the "recordkey" column or have edit disabled remains uneditable in this mode.

After making your changes, either submit or discard the batch edits through the new set of controls.

To also include insertions or deletions in batch edit mode, include the `editor-controls` attribute.
This will append the row editor and remover columns to the grid.

```html
<zing-grid batch-edit editor-controls></zing-grid>
```

[Example code](https://app.zingsoft.com/demos/embed/EMFJZADW)

## Custom Status Message (tokenized string)

During batch edit mode, a status message displays the number of raw edits made.
This status message can be customized by setting `batch-edit-status` to a tokenized string.

```html
<zing-grid
  batch-edit
  batch-edit-status="The grid has [[modified]] modified rows"
  editor-controls>
</zing-grid>
```

Here is a list of available tokens:
- changes: number of raw changes (edits, insertions, deletions)
- deleted: number of rows deleted
- fieldsEdited: number of cells edited
- inserted: number of rows inserted
- modified: number changes (edits, insertions, deletions) to rows
- recordsEdited: number of rows edited

[Example code](https://app.zingsoft.com/demos/embed/3JCVVSB0)

## Custom Status Message (function)

The status message can also be customized through a function.
Just set `batch-edit-status` to the name of the function.

```html
<zing-grid
  batch-edit
  batch-edit-status="customStatus"
  editor-controls>
</zing-grid>
```

```js
function customMessage(changes, oDom) {
  return `The grid has ${changes.modified} modified rows`;
};
```

The function definition for the batch status message is `function(changes, oDom)`.

The first argument, `changes`, is an object containing the following properties:
- changes: number of raw changes (edits, insertions, deletions)
- deleted: number of rows deleted
- fieldsEdited: number of cells edited
- inserted: number of rows inserted
- modified: number changes (edits, insertions, deletions) to rows
- recordsEdited: number of rows edited

The second argument is `oDom`, which is the DOM reference to the `<span>` element containing the batch status message.

[Example code](https://app.zingsoft.com/demos/embed/39BD15LQ)

## Confirmation Dialogs

A confirmation dialog appears when confirming or discarding batch edit changes.
To customize which confirmation dialogs to display, use the `confirmations` attribute.

It accepts one or more (comma-separated string) of the following values:
- batch-edit
- batch-edit-discard
- delete

Or set to "disabled" to not display any confirmation dialogs.

```html
<zing-grid
  batch-edit
  batch-edit-status="customStatus"
  confirmations="batch-edit, batch-edit-discard"
  editor-controls>
</zing-grid>
```

[Example code](https://app.zingsoft.com/demos/embed/5BDUK4EQ)

## External Input (get/set)

You can use an external input through the API method `setBatchEdit()` (see below) to dynamically set batch editing.

The `getBatchEdit()` API method will return whether batch edit mode is enabled.

```js
const zgRef = document.querySelector('zing-grid');
zgRef.setBatchEdit(true);

console.log(zgRef.getBatchEdit());   // true
```

[Example code](https://app.zingsoft.com/demos/embed/FBI18VKS)

The batch edit status and confirmations can also be set through their associated API methods:
- `getBatchEditStatus()`
- `setBatchEditStatus()`
- `getConfirmations()`
- `setConfirmations()`