Tag Helpers

CoreUpload ships three main Tag Helpers:

  • <core-upload> for the primary uploader UI
  • <upload-attachments> for attachment-list scenarios
  • <upload-dropzone> for standalone drop targets

Common patterns

Use <core-upload> when you want the full queue, progress UI, and JavaScript API:

<core-upload asp-multiple="true"
             asp-auto-upload="false"
             asp-chunked="true"
             asp-max-size="2GB"
             asp-hidden-input-id="UploadedFileGuids">
</core-upload>

Use <upload-attachments> when the UI should look like an attachments list:

<upload-attachments asp-max-files="10"
                    asp-hidden-input-id="AttachmentGuids">
</upload-attachments>

Use <upload-dropzone> when the page already has its own surrounding layout and only needs a drop area:

<upload-dropzone asp-text="Drop files here"
                 asp-auto-upload="true">
</upload-dropzone>

5.2 additions

Per-file metadata, client-side renditions, chunk prioritization, and queue keyboard navigation are all configurable straight from the Tag Helper:

<core-upload asp-upload-url="/api/upload/upload"
             asp-multiple="true"
             asp-meta-fields='[{"id":"caption","label":"Caption"},
                               {"id":"category","required":true}]'
             asp-renditions='[{"name":"thumb","maxSize":200},
                              {"name":"medium","maxWidth":1024,
                               "format":"image/webp","quality":0.8}]'
             asp-on-rendition-created="onRendition"
             asp-prioritize-first-last-chunk="true">
</core-upload>
  • asp-meta-fields — JSON array of per-file editable fields. Inline inputs render on pending queue rows; image files in the thumbnail grid get a pencil button that opens a modal editor (also available programmatically via uploader.openMetaEditor(taskId)). required fields block that file's upload until filled.
  • asp-renditions — JSON array of scaled renditions generated client-side and uploaded alongside the original (linked via renditionOf). Remember to whitelist transcoded output formats (e.g. .webp) in your allowed extensions, client and server.
  • asp-on-rendition-created — JavaScript callback (renditionTask, originalTask).
  • asp-prioritize-first-last-chunk — chunk 0 and the final chunk upload before the middle, so the server can validate the file's head/tail early (flow.js parity).
  • asp-keyboard-navigation — deep queue keyboard navigation (roving tabindex, Arrow/Home/End, Enter/Delete row actions). On by default; set false to opt out.

Malformed JSON in asp-meta-fields / asp-renditions is ignored rather than emitted.