Skip to main content
Version: 13.x (Current)

Import Modal


The Import Modal renders a modal to allow the user to signal the need for a data import to be performed on a collection.

How to configure

The Import Modal does not require any particular configuration.

"tag": "bk-import-modal"

The body of the rendered modal is a form that allows the user to select what parameters should be appended to the import data request. These include:

  • the file with the data to be imported
  • what encoding should be used ("utf8", "ucs2", ...) to parse the file, in case this is of type CSV
  • what delimiter should be used (comma or semicolon) to parse the file, in case this is of type CSV
  • what escape character should be used to parse the file, in case this is of type CSV

Supported file extensions are: .ndjson, .json, .csv

Upon submitting the Import Modal, this signals the need to import data with the specified options. A component like the CRUD Client could pick up on this request and trigger data import (as long as backend services includes an instance of the CRUD Service of version 6.9.0 or higher).


The texts of the Import Modal can be customized through the property customLocale, which accepts an object shaped like the following:

type Locale = {
modalTitle: LocalizedText
file: LocalizedText
fileRequired: LocalizedText
encoding: LocalizedText
encodingPlaceholder: LocalizedText
delimiter: LocalizedText
delimiterCommaOption: LocalizedText
delimiterSemicolonOption: LocalizedText
separator: LocalizedText
okButton: LocalizedText
cancelButton: LocalizedText

where LocalizedText is either a string or an object mapping language acronyms to strings.


Properties & Attributes


Listens to

import-dataprompts modal opening


import-data/user-confignotifies the bus of user config for next import data task