This event occurs after an image is uploaded.

Adding Event

Using API

var editorId = 'synapEditor';
var editorConfig = {};
var html = '';
var editor = new SynapEditor(editorId, editorConfig, html);


editor.setEventListener('afterUploadImage', function (e) {
});

Function

var editorId = 'synapEditor';
var editorConfig = {};
var html = '';

function SynapEditorAfterUploadImage(e) {
}

new SynapEditor(editorId, editorConfig, html);

When the Editor is initialized

var editorId = 'synapEditor';
var editorConfig = {};
var html = '';
var eventListeners = {
    afterUploadImage: function (e) {
    }
};

new SynapEditor(editorId, editorConfig, html, eventListeners);

Object Delivered through Functions

In the form of parameter e delivered through functions

// release 2.2.0
{
	editor: SynapEditor,
	eventType:  'afterUploadImage',
	cancelable: false,
	returnValue: null,
	path: '/upload/path/filename.png', // The upload path.
	elementId: 'se-123456-abcdefg-7890', // HTML Element Id (wapper)
	isBackground: false // Whether the image is a background image.
}
// release 2.2.1 or above
{
	editor: SynapEditor,
	eventType:  'afterUploadImage',
	cancelable: false,
	returnValue: null,
	fileType: 'image', // [2.2.1] File type
	path: '/upload/path/filename.png',
	elementId: 'se-123456-abcdefg-7890',
	isBackground: false
}
// release 2.10.0 or above
{
	editor: SynapEditor,
	eventType:  'afterUploadImage',
	cancelable: false,
	returnValue: null,
	fileType: 'image',
	path: '/upload/path/filename.png',
    responseData: {},   // [2.10.0] complete response data
	elementId: 'se-123456-abcdefg-7890',
	isBackground: false
}
// release 2.15.0 or above
{
	editor: SynapEditor,
	eventType:  'afterUploadImage',
	cancelable: false,
	returnValue: null,
	fileType: 'image',
	path: '/upload/path/filename.png',
    responseData: {},
	elementId: 'se-123456-abcdefg-7890',
	isBackground: false,
    error: undefined    // [2.15.0] Error information when upload fails
}


Image upload failed

Starting with the 2.15.0 release, the afterUploadImage event is also raised when an upload fails.

An Error object is passed to the error property of the object that is passed to the afterUploadImage event when upload fails.

Example of removing failed images when upload fails

editor.setEventListener('afterUploadImage', function (e) {
    if (e.error && e.error.status === 500) {
        e.editor.execCommand('showDialog', 'alert', 'Image upload failed.');
        var image = e.editor.getAPIModelById(e.elementId);
        image.remove();
    }
});