Skip to end of metadata
Go to start of metadata

You are viewing an old version of this content. View the current version.

Compare with Current View Version History

« Previous Version 4 Next »

✍️ Description

This component can be used to let your customers import data into Via directly from your website without requiring a login.

🔨 Usage

First, you will need to create a Import instance. The import constructor takes 4 parameters.

const importer = new Extend.import(boardId, listId, companyId, embedToken);

BoardId* (string)

ListId* (string)

companyId* (string)

embedToken* (string)

The Board ID on which you want the cards to be imported to.

The List ID on which you want the cards to be imported to.

Your Company ID

The embed token you obtained from the ‘API Settings’ in your admin dashboard

With the Import component fully configured, now call open on the importer to start the import process.

importer.open();

Basic example

<script
  type="text/javascript"
  src="https://attachments.viaboards.io/embed/embeds-prod.js"
></script>

<script type="text/javascript">
  const boardId = "YOUR_BOARD_ID";
  const listId = "YOUR_LIST_ID";
  const companyId = "YOUR_COMPANYID";
  const embedToken = "YOUR_EMBED_TOKEN";
  const importer = new Extend.import(boardId, listId, companyId, embedToken);

  importer.onSuccess((message) => {
    // Do something with the data here
    return "Done!";
  });
</script>

<div id="root">
  <button onclick="importer.open()">Open Importer</button>
</div>

📲 Callbacks

onClosed

This will get called anytime the importer is closed by the user or another process.

importer.onClosed((message) => {
  console.log(message);
});

onLoaded

This is fired after the importer iFrame is fully loaded and ready to be displayed to the user.

importer.onLoaded((message) => {
  console.log(message);
});

onError

Any and all errors will be routed to this callback.

importer.onError((message) => {
  console.log(message);
});

onProccessing

Fired when a import process is started.

importer.onProccessing((message) => {
  console.log(message);
});

onSuccess

When the import process is complete we will respond here.

importer.onSuccess((message) => {
  console.log(message);
});

  • No labels