Building Import and Export Functionality in VBCS

Export: generating downloadable files

The most common export need is downloading table data as CSV or Excel. There are two approaches:

Client-side CSV (simple, no server needed): convert the current table data to a CSV string in JavaScript and trigger a browser download:

var rows = $page.variables.tableData;
var headers = 'ID,Name,Amount,Status';
var csv = headers + '\n' + rows.map(function(r) {
  return [r.id, r.name, r.amount, r.status].join(',');
}).join('\n');

var blob = new Blob([csv], { type: 'text/csv' });
var url = URL.createObjectURL(blob);
var a = document.createElement('a');
a.href = url; a.download = 'export.csv'; a.click();

Server-side export (for large datasets): call an OIC integration that queries the database, generates the file, and returns it as Base64. VBCS receives the Base64 string and triggers the browser download. Better for exports exceeding 1,000 rows.

Export using BI Publisher

For formatted Excel or PDF exports with company branding, use BI Publisher:

1. Build a BI Publisher report template
2. Call the BIP REST API from OIC to generate the report
3. Return the file content to VBCS for download

This produces professional-looking exports with headers, formatting, and logos — far superior to raw CSV.

Import: uploading files to VBCS

VBCS’s oj-file-picker component handles file selection. On selection, read the file using JavaScript’s FileReader API:

var file = $event.detail.files[0];
var reader = new FileReader();
reader.onload = function(e) {
  var csvContent = e.target.result;
  // parse and validate
};
reader.readAsText(file);

CSV parsing and validation

Parse CSV client-side before calling any backend. Validate:

• Required columns are present (header check)
• Data types match (number, date formats)
• Required fields are not blank
• Reference values exist (foreign keys)

Display validation errors in a table within the VBCS app — show row number and error description. Don’t submit until all errors are resolved.

Large file imports via OIC

For large imports (1,000+ rows), don’t process in the browser. Instead:

1. Upload the file to OIC via a service connection
2. OIC processes it asynchronously in the background
3. VBCS polls a status endpoint and shows a progress indicator
4. On completion, display a summary (records processed, errors)