• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

UploadEvent

Arguments for the upload event. The upload event fires when one or more files are about to be uploaded. If you cancel the event, the upload is prevented. You can add headers to the request.

 @Component({
   selector: 'my-upload',
   template: `
   <kendo-upload
     [saveUrl]="uploadSaveUrl"
     [removeUrl]="uploadRemoveUrl"
     (upload)="uploadEventHandler($event)">
   </kendo-upload>
   `
 })
 export class UploadComponent {
   uploadSaveUrl = 'saveUrl'; // should represent an actual API endpoint
   uploadRemoveUrl = 'removeUrl'; // should represent an actual API endpoint

   uploadEventHandler(e: UploadEvent) {
     e.headers = e.headers.append('X-Foo', 'Bar');
   }
 }
NameTypeDefaultDescription

data

Object

The optional object that is sent to the upload handler in the form of key/value pair.

 @Component({
   selector: 'my-upload',
   template: `
   <kendo-upload
     [saveUrl]="uploadSaveUrl"
     [removeUrl]="uploadRemoveUrl"
     (upload)="uploadEventHandler($event)">
   </kendo-upload>
   `
 })
 export class UploadComponent {
   uploadSaveUrl = 'saveUrl'; // should represent an actual API endpoint
   uploadRemoveUrl = 'removeUrl'; // should represent an actual API endpoint

   uploadEventHandler(e: UploadEvent) {
     e.data = {
       description: 'File description'
     };
   }
 }

files

FileInfo[]

The list of the files that will be uploaded.

headers

HttpHeaders

The headers of the request.

Methods

isDefaultPrevented

If the event is prevented by any of its subscribers, returns true.

Returns

boolean

true if the default action was prevented. Otherwise, returns false.

preventDefault

Prevents the default action for a specified event. In this way, the source component suppresses the built-in behavior that follows the event.