Category / Section
How to prevent entering characters in the numbered columns of a JavaScript spreadsheet
1 min read
This knowledge base explains how to prevent entering characters in the numbered columns of a JavaScript spreadsheet. To achieve this requirement, use the addDataValidation method and the dialogBeforeOpen event. Apply the data validation in the created event first, and then use the dialogBeforeOpen event to customize the alert dialog content.
[HTML]
<div id="spreadsheet"></div>
[TS]
import { Spreadsheet, DialogBeforeOpenEventArgs } from '@syncfusion/ej2-spreadsheet';
let spreadsheet: Spreadsheet = new Spreadsheet({
created: (): void => {
//Applies data validation to specified range in the active sheet.
spreadsheet.addDataValidation(
{ type: 'WholeNumber', operator: 'Between', value1: '0', value2: '100' },
'A1:A100'
);
},
dialogBeforeOpen: (args: DialogBeforeOpenEventArgs): void => {
// Edit the dialog content using the dialogBeforeOpen event.
if (args.dialogName == 'ValidationErrorDialog') {
args.content = 'Characters are not allowed in Number Column';
}
},
});
spreadsheet.appendTo('#spreadsheet');
Sample Link:
https://stackblitz.com/edit/rdjujx-amffkr?file=index.ts
Output:
Demo Link:
https://ej2.syncfusion.com/demos/#/bootstrap5/spreadsheet/data-validation.html
Documentation Link:
https://ej2.syncfusion.com/documentation/spreadsheet/cell-range#data-validation