JavaScript API

Access the uploader programmatically through the JavaScript API. Get the instance, subscribe to events, and control uploads from code.

What you should see: the component driven entirely from code — add files, start, pause and query state without touching its own UI.

Drag & drop files here, or paste from clipboard

Console Output

<core-upload id="jsApiUploader"
 asp-upload-url="/api/upload/upload"
 asp-multiple="true"
 asp-progress="true">
</core-upload>

<script>
var uploader = CoreUpload.getInstance('#jsApiUploader');

uploader.on('fileAdded', function(task) {
 console.log('Added: ' + task.name);
});

uploader.on('taskComplete', function(task, result) {
 console.log('Uploaded: ' + task.name);
});

// Get queued files
var files = uploader.getFiles();

// Clear the file list
uploader.clear();
</script>

The tag helper does not take control away

What the tag helper emits is an ordinary CoreUpload.create(...) call, so the instance is reachable from your own script and exposes the full client API: upload(), cancel(), pause(), resume(), addFile(), reset().

Finding the instance

CoreUpload.getInstance(idOrSelector) returns the uploader bound to a container, so code elsewhere on the page can drive an uploader it did not construct — a toolbar, a wizard step, a form's submit handler.