Callbacks
Hook into the submission lifecycle. Pass a callbacks object to Issued.init (or the callbacks prop on the React / Vue / React Native components).
All callbacks
onBeforeSubmit(formData) => boolean | Promise<boolean>Called right before a submission is sent. Return false (or a Promise that resolves to false) to cancel. Useful for confirming terms, capturing one more field, or gating by internal state.
onSuccess(response: { success, ticketId, message, submissionId }) => voidCalled once the submission has been accepted by the server. The ticketId is stable — safe to use for linking or analytics.
onError(error: IssuedError) => voidCalled on submission failure. The IssuedError carries a code (e.g. NETWORK_ERROR, API_ERROR, VALIDATION_FAILED) and a context object.
onValidationError(errors: Record<string, string[]>) => voidCalled when client-side validation fails. The error map is keyed by field name with an array of messages per field.
onRender() => voidCalled once the form is rendered and interactive. Useful for telemetry or focus management.
Gating a submission
Return false from onBeforeSubmit to cancel.
Issued.init({
projectId: "your-project-id",
fields: { /* ... */ },
callbacks: {
onBeforeSubmit: async (formData) => {
if (!(await confirmTermsOfService())) {
return false;
}
return true;
}
}
});Success & error
Issued.init({
projectId: "your-project-id",
fields: { /* ... */ },
callbacks: {
onSuccess: ({ ticketId }) => {
toast.success('Thanks! We got it.');
analytics.track('support_submitted', { ticketId });
},
onError: (err) => {
console.error(err.code, err.message);
Sentry.captureException(err);
}
}
});Inspecting validation errors
callbacks: {
onValidationError: (errors) => {
// errors: { subject: ["Required"], email: ["Invalid format"] }
for (const [field, messages] of Object.entries(errors)) {
console.warn(field, messages);
}
}
}More configuration
See also: fields reference, styling.