# HandlersSettings

## Content

# Type Alias: HandlersSettings

```ts
type HandlersSettings = object;
```

## Properties

### onAfterCreate?

```ts
optional onAfterCreate?: () => void;
```

A handler that is called when create is complete

#### Returns

`void`

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
	documents: {
       handlers: {
          onAfterCreate: () => {
				console.log('New report created successful.')
			}
      }
	}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
          onAfterCreate: () => {
				console.log('New report created successful.')
			}
      }
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
          onAfterCreate: () => {
				console.log('New report created successful.')
			}
      }
	}
});
```

***

### onAfterOpen?

```ts
optional onAfterOpen?: () => void;
```

A handler that is called when open is complete

#### Returns

`void`

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
	documents: {
       handlers: {
           onAfterOpen: () => {
				console.log('New report opened successful.')
			}
       }
	}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
           onAfterOpen: () => {
				console.log('New report opened successful.')
			}
       }
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
           onAfterOpen: () => {
				console.log('New report opened successful.')
			}
       }
	}
});
```

***

### onAfterSave?

```ts
optional onAfterSave?: (info) => void;
```

A handler that is called when save is complete

#### Parameters

##### info

[`SaveDocumentInfo`](SaveDocumentInfo)

#### Returns

`void`

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
		documents: {
			fileView: {
		handlers: {
			onBeforeSave: (info) => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
		}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
		handlers: {
			onAfterSave: (info) => {
				if (!info.success) throw new Error(`Report saving error`);
			}
		}
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
		handlers: {
			onAfterSave: (info) => {
				if (!info.success) throw new Error(`Report saving error`);
			}
		}
	}
});
```

***

### onBeforeClose?

```ts
optional onBeforeClose?: (options) => Promise<boolean>;
```

An async handler, cancels saving unsaved changes if returned true

#### Parameters

##### options

[`CloseDocumentInfo`](CloseDocumentInfo)

#### Returns

`Promise`&lt;`boolean`&gt;

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
 documents: {
     handlers: {
         onBeforeClose(options) {
             return new Promise((resolve, _) => {
                 if (!options.hasUnsavedChanges) return resolve(true);
                 if (options.isNew) return resolve(false);
                 arWebDesigner.apiOf('ar-web-designer').documents.save();
                 return resolve(true);
             });
          }
       }
 }
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
 documents: {
     handlers: {
         onBeforeClose(options) {
             return new Promise((resolve, _) => {
                 if (!options.hasUnsavedChanges) return resolve(true);
                 if (options.isNew) return resolve(false);
                 GrapeCity.ActiveReports.Designer.apiOf('ar-web-designer').documents.save();
                 return resolve(true);
             });
          }
       }
 }
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
 documents: {
     handlers: {
         onBeforeClose(options: CloseDocumentInfo) {
             return new Promise((resolve, _) => {
                 if (!options.hasUnsavedChanges) return resolve(true);
                 if (options.isNew) return resolve(false);
                 GrapeCity.ActiveReports.Designer.apiOf('ar-web-designer').documents.save();
                 return resolve(true);
             });
          }
       }
 }
});
```

***

### onBeforeCreate?

```ts
optional onBeforeCreate?: () => Promise<boolean>;
```

An async handler, cancels create process if returned false

#### Returns

`Promise`&lt;`boolean`&gt;

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
	documents: {
       handlers: {
           onBeforeCreate: () => {return false}
       }
	}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
           onBeforeCreate: () => {return false}
       }
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
           onBeforeCreate: () => {return false}
       }
	}
});
```

***

### onBeforeOpen?

```ts
optional onBeforeOpen?: () => Promise<boolean>;
```

An async handler, cancels opening process if returned false

#### Returns

`Promise`&lt;`boolean`&gt;

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
	documents: {
       handlers: {
			onBeforeOpen: () => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
       }
	}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
			onBeforeOpen: () => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
       }
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
       handlers: {
			onBeforeOpen: () => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
       }
	}
});
```

***

### onBeforeSave?

```ts
optional onBeforeSave?: (info) => Promise<boolean>;
```

An async handler, cancels saving process if returned false

#### Parameters

##### info

[`SaveDocumentInfo`](SaveDocumentInfo)

#### Returns

`Promise`&lt;`boolean`&gt;

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
		documents: {
			fileView: {
		handlers: {
			onBeforeSave: (info) => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
		}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
		handlers: {
			onBeforeSave: (info) => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
		}
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
		handlers: {
			onBeforeSave: (info: SaveDocumentInfo) => {
				return new Promise((resolve, reject) => {
					resolve(false);
				});
			}
		}
	}
});
```

***

### onDocumentChanged?

```ts
optional onDocumentChanged?: (options) => void;
```

A handler that is triggered when report content is changed

#### Parameters

##### options

###### document

`any`

###### hasUnsavedChanges

`boolean`

#### Returns

`void`

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
	documents: {
      handlers: {
			onDocumentChanged: (options) => {
				if (options.hasUnsavedChanges) console.log('Currently edited report has unsaved changes.');
			}
		}
	}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
      handlers: {
			onDocumentChanged: (options) => {
				if (options.hasUnsavedChanges) console.log('Currently edited report has unsaved changes.');
			}
		}
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
		handlers: {
			onDocumentChanged: (options: { document: any, hasUnsavedChanges: boolean }) => {
				if (options.hasUnsavedChanges) console.log('Currently edited report has unsaved changes.');
			}
		}
	}
});
```

***

### onInfoUpdate?

```ts
optional onInfoUpdate?: (options) => void;
```

A handler that is triggered when report name/id is updated

#### Parameters

##### options

###### id?

`string`

###### name

`string`

###### platform

[`SupportedDocumentType`](SupportedDocumentType)\[`"platform"`\]

###### type

[`SupportedDocumentType`](SupportedDocumentType)\[`"type"`\]

#### Returns

`void`

#### Examples

```javascript
// ESM usage
import { arWebDesigner } from './web-designer.js';
arWebDesigner.create('#ar-web-designer', {
	documents: {
      handlers: {
          onInfoUpdate: (options) => {
				console.log(`name changed ${options.name}`);
			}
		}
	}
});
```

```javascript
// UMD usage
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
      handlers: {
          onInfoUpdate: (options) => {
				console.log(`name changed ${options.name}`);
			}
		}
	}
});
```

```typescript
GrapeCity.ActiveReports.Designer.create('#ar-web-designer', {
	documents: {
      handlers: {
          onInfoUpdate: (options:
               {
                   name: string,
                   id?: string,
                   type: SupportedDocumentType['type'],
                   platform: SupportedDocumentType['platform']
               }) =>
					{console.log(`name changed ${options.name}`);}
		}
	}
});
```
