Core Concepts

importOK provides several different approaches to import the records once they are ready.

#Record by record

This is by far the simplest approach where the records are passed one by one, in a row. If you already have an API in place, it is recommended to start with this approach. Once you have it working, you can switch to batch processing to improve the performance.

In the following example, a callback is registered for onRecordReady and it will be called one time for each record. Note that the meta object is passed for your convenience.

 1ImportOK.add(
 2  document.getElementById('my-app-element'),
 3  {
 4    fields: {...},
 5    meta: {...},
 6    onRecordReady: async function (record, meta) {
 7      return await fetch('https://your-api.com', {
 8        method: 'POST',
 9        headers: {
10          'Content-Type': 'application/json'
11        },
12        body: JSON.stringify(record)
13      });
14    }
15  }
16);

Every time a callback is completed the progress bar on the user interface will be updated accordingly, demonstrating the progress.

#Batch processing

To improve performance, you can define how many API calls can be executed concurrently. Similar to above scenario, a callback is registered for onRecordReady and it will be called one time for each record but with up to 100 calls in parallel.

 1ImportOK.add(
 2  document.getElementById('my-app-element'),
 3  {
 4    fields: {...},
 5    meta: {...},
 6    throttle: 100,
 7    onRecordReady: async function (record, meta) {
 8      return await fetch('https://your-api.com', {
 9        method: 'POST',
10        headers: {
11          'Content-Type': 'application/json'
12        },
13        body: JSON.stringify(record)
14      });
15    }
16  }
17);

Every time a callback is completed the progress bar on the user interface will be updated accordingly, demonstrating the progress.

#Full set of records

It is also possible to receive the full set which is useful when you want to process the records in the backend.

In the following example, we register a callback for onImportReady and it will be called only once.

 1ImportOK.add(
 2  document.getElementById('my-app-element'),
 3  {
 4    fields: {...},
 5    meta: {...},
 6    onImportReady: async function (records, meta) {
 7      return await fetch('https://your-api.com', {
 8        method: 'POST',
 9        headers: {
10          'Content-Type': 'application/json'
11        },
12        body: JSON.stringify(records)
13      });
14    }
15  }
16);

#Meta

The meta object is passed to all callbacks and it contains the following properties:

In addition to the predefined meta data described above, you can also pass your own metadata as part of the available props.