# Bind File Import Events

## Content

You can add functions in the SpreadJS Designer Component during file import operations.

## Binding Methods

Designer Component provides event binding methods bind, unbind, and unbindAll in the [Designer](/spreadjs/api/v17/designer/classes/GC.Spread.Sheets.Designer.Designer) class. These methods help to add or remove events in the Designer Component.

| **Method** | **Description** |
| ------ | ----------- |
| bind | Binds an event to the designer. Accepts the type of event and the function to run when the event occurs. |
| unbind | Removes the binding of an event to the designer. Accepts the type of event and the function for which to remove the binding |
| unbindAll | Removes the binding of all events to the designer. |

## Events

Designer Component provides file import-related events namely, FileLoading and FileLoaded in the [Designer.Events](/spreadjs/api/v17/designer/classes/GC.Spread.Sheets.Designer.Events) class. These events are accepted as strings in the bind methods to perform user-specified functions in the SpreadJS Designer Component.

| Event | Description |
| ----- | ----------- |
| FileLoading | Occurs when the file is loading due to a Spread.Sheets.Designer file action. |
| FileLoaded | Occurs when the file has loaded due to a Spread.Sheets.Designer file action. |

These events occur when importing JSON, Excel, or CSV files to SpreadJS, but you can also specify format-specific events with the [FileType](/spreadjs/api/v17/designer/enums/GC.Spread.Sheets.Designer.FileType) enumeration options such as Json, Excel, and CSV.

## Example

The following code sample sets the `FileLoading` event to display the number of worksheets if the imported file format is Excel and the number of worksheets is more than or equal to three. It also displays a message when file import is completed.

```JavaScript
var designer = new GC.Spread.Sheets.Designer.Designer(document.getElementById("designerHost"), '', spread);

// Using the FileLoading Event in bind method
designer.bind(GC.Spread.Sheets.Designer.Events.FileLoading, function(type, message){
    if (message.fileType = GC.Spread.Sheets.Designer.FileType.Excel){
        let spreadJsonData = message.data;
        if(spreadJsonData.sheetCount >= 3) {
            window.alert("Number of worksheets: " + spreadJsonData.sheetCount);
        }
    };
});            

// Using the FileLoaded Event in bind method
designer.bind(GC.Spread.Sheets.Designer.Events.FileLoaded, function(event,data){
    window.alert("File has loaded");
});

// Using the unbind method to remove FileLoaded event
designer.unbind(GC.Spread.Sheets.Designer.Events.FileLoaded);

// Using the unbindAll method to remove all the events
designer.unbindAll();
```

![](https://gcdocumentsitekrblob.blob.core.windows.net/document-site-files/images/8d606653-16a0-474d-b9dc-e2b4d01c2446/images/designer-event.gif)