The form definition when the draft was saved
The submission data
Delete a PendingFormSubmission before it is processed based on the
pendingTimestamp property.
const pendingTimestamp = '2020-07-29T01:03:26.573Z'
await submissionService.deletePendingQueueSubmission(pendingTimestamp)
Action to cancel completing a form, currently goes back in the browser history or attempts to close the browser tab if there is no history.
const options = {
definition: OneBlinkForm,
externalId: 'external-id-set-by-developer',
}
// Only used for relative URLs
const pushRelativePath = (path) => {
window.location.href = path
}
try {
await submissionService.executeCancelAction(options, pushRelativePath)
} catch (error) {
// Handle error while closing browser tab.
// Display message to user to close it manually
}
The URL to redirect the user to after completing the task via form submission
The task
The task action
The task group
The task group instance
Execute the post submission action for a form after a successful form submission.
const formSubmissionResult = {
submissionId: '89c6e98e-f56f-45fc-84fe-c4fc62331d34',
submissionTimestamp: '2020-07-29T01:03:26.573Z'
formsAppId: 1,
submission: {
form: 'data',
goes: 'here'
},
definition: OneBlinkForm,
payment: {
hostedFormUrl: 'https://payment.com/transaction'
},
draftId: '2974602c-2c5b-4b46-b086-87ee9b2aa233',
jobId: 'bb37d1da-9cda-4950-a36a-22f58b25de3a',
preFillFormDataId: '7763f828-4aaf-49dc-9c1b-e2eeea8fa990',
externalId: 'external-id-set-by-developer',
}
// Only used for relative URLs
const pushRelativePath = (path) => {
window.location.href = path
}
try {
await submissionService.executePostSubmissionAction(formSubmissionResult, pushRelativePath)
} catch (error) {
// Handle error while closing browser tab.
// Display message to user to close it manually
}
Get an array of PendingFormSubmission
const pendingSubmission =
await submissionService.getPendingQueueSubmissions()
// Display pending submissions to user...
Retrieve submission data for a known formId and submissionId
const formId = 1
const submissionId = 'fba95b9d-5a9c-463d-ab68-867f431e4120'
const credentials = await formSubmissionService.getSubmissionData({
formId,
submissionId,
})
Go back in the browser history or attempts to close the browser tab if there is no history.
try {
await submissionService.goBackOrCloseWindow()
} catch (error) {
// Handle error while closing browser tab.
// Display message to user to close it manually
}
Force processing the pending queue. This must be called to process the pending queue and is best used when the application comes back online.
await submissionService.processPendingQueue()
Register a listener function that will be passed a progress event when an attachment for an item in the pending queue is being processed.
const listener = async ({ progress }) => {
// update the UI to reflect the progress here...
}
const deregister =
await submissionService.registerPendingQueueAttachmentProgressListener(
attachment.id,
listener,
)
// When no longer needed, remember to deregister the listener
deregister()
Register a listener function that will be passed a progress event when an attachment for an item in the pending queue is being processed.
const listener = async ({ progress }) => {
// update the UI to reflect the progress here...
}
const deregister =
await submissionService.registerPendingQueueAttachmentProgressListener(
attachment.id,
listener,
)
// When no longer needed, remember to deregister the listener
deregister()
Register a listener function that will be passed an array of PendingFormSubmissions when the pending queue is modified.
const listener = async (pendingSubmissions) => {
// use pending submissions here...
}
const deregister =
await submissionService.registerPendingQueueListener(listener)
// When no longer needed, remember to deregister the listener
deregister()
Register a listener function that will be passed an array of PendingFormSubmissions when the pending queue is modified.
const listener = async (pendingSubmissions) => {
// use pending submissions here...
}
const deregister =
await submissionService.registerPendingQueueListener(listener)
// When no longer needed, remember to deregister the listener
deregister()
Register a listener function that will be passed a progress event when an item in the pending queue is being processed.
const listener = async ({ progress }) => {
// update the UI to reflect the progress here...
}
const deregister =
await submissionService.registerPendingQueueProgressListener(
pendingQueueItem.pendingTimestamp,
listener,
)
// When no longer needed, remember to deregister the listener
deregister()
Register a listener function that will be passed a progress event when an item in the pending queue is being processed.
const listener = async ({ progress }) => {
// update the UI to reflect the progress here...
}
const deregister =
await submissionService.registerPendingQueueProgressListener(
pendingQueueItem.pendingTimestamp,
listener,
)
// When no longer needed, remember to deregister the listener
deregister()
Submit a FormSubmission. Offline submissions will be added to a pending queue
and be processed using the processPendingQueue() function. FormSubmissions
with payment submission events will return the FormSubmissionResult with a
payment property set, this should be used to redirect the user to the
payment URL. Will also handle cleaning up auto save data (if the
autoSaveKey property is passed), locally stored drafts and prefill data.
const formSubmission = {
formsAppId: 1,
submission: {
form: 'data',
goes: 'here',
},
definition: OneBlinkForm,
captchaTokens: [],
draftId: '2974602c-2c5b-4b46-b086-87ee9b2aa233',
jobId: 'bb37d1da-9cda-4950-a36a-22f58b25de3a',
preFillFormDataId: '7763f828-4aaf-49dc-9c1b-e2eeea8fa990',
externalId: 'external-id-set-by-developer',
}
// Pass paymentReceiptUrl if submission may require a payment
const paymentReceiptUrl = `${window.location.origin}/payment-receipt`
// Pass schedulingBookingUrlConfiguration if submission utilise scheduling
const schedulingBookingUrlConfiguration = {
schedulingReceiptUrl: 'https://my-website.com/receipt',
schedulingCancelUrl: 'https://my-website.com/cancel',
}
const submissionResult = await submissionService.submit({
formSubmission,
paymentReceiptUrl,
schedulingBookingUrlConfiguration,
})
if (submissionResult.scheduling) {
// Redirect user to booking form
window.location.href = submissionResult.scheduling.bookingUrl
return
}
if (submissionResult.payment) {
// Redirect user to payment form
window.location.href = submissionResult.payment.hostedFormUrl
return
}
if (submissionResult.isOffline) {
if (submissionResult.isInPendingQueue) {
// Display message to user that the submission
// has been added to the pending queue
} else {
// Display message to user that this submission can
// not be processed while offline (most likely because it requires a payment)
}
return
}
// submissionResult.submissionId and submissionResult.submissionTimestamp
// will be set if the submission was successful
Submission Service
Helper functions for handling form submissions