Where is the callback event handler after a file is deleted from this.apiRemoveUrl ?

[matthew]

I want to handle what happens after this REMOVE URL is called... I want to then get the file list and re bind it to the upload control..

How do I do this ?

 

 deleteAttachmentKendo(e: RemoveEvent): void {

    console.log(`Removing ${e.files[0].name}`);

    const myFile: MyFileInfo = <MyFileInfo>e.files[0];

    e.data = {

      attachmentIdPost: myFile.attachmentId

    };

    this.getFiles(this.currentOrder.id);

  }

[Martin]

Hello Мatthew,

Thank you for the provided code snippet.

In general, events are triggered on every user interaction so that the developer can respond to something that didn't know when it will be happening.

On the other side when the developer programmatically update, changes, or customize a component property through a built-in method, then an event won't be triggered, since the developer knows when and where the change will be happening.

The remove event of the Upload component is triggered when the end-user is about to remove an already uploaded file from the file list:

There is no second event triggered at this stage. The developer can handle the remove event and do the respective updates.

In order to be properly removed the Upload requires removeUrl option to be set which points to the respective controller in the back-end responsible for removing the uploaded files.

Another option to remove an uploaded file is through a removeFilesByUid method of the Upload. The method is especially useful when the developer wants to remove an uploaded file programmatically (for example on a custom button click event, or some other confirmation process). Please keep in mind that when using the method remove event of the component will not be triggered.

Regards,
Martin
Progress Telerik

[Matt]

I am kind of new to this all.. I am not getting it.. Where is the event handler for the client side so when I click the 'x' in the upload control I can have it goto an event on the client side ?   Can you show me a simple example ? 

I would think it would be like (removeFile)="myMethod($event)"

 

  <kendo-upload  [(ngModel)]="fileList" [ngModelOptions]="{standalone: true}"

                    [showFileList]="true" [autoUpload]="true" [saveUrl]="apiUploadUrl"

                    (upload)="uploadEventHandler($event)" (success)="onSuccess($event)">

               

</kendo-upload>

 

 

[Matt]

 

oh.. I think I just found it ? Ill try this.. 

 

The whole reason for this is I am manually rebinding the upload control to the server side object that contains the files and metadata... maybe there is a better way to do all this I am not sure

[Matt]

I notice I need a  removeUrl just to get the 'x' to show up but I want to handle the event myself so how do I do that ? 

[removeUrl]="apiRemoveUrl"

 

 

 

[Martin]

Hi Matt,

The developer can handle the remove event of the Upload component and prevents its action by using preventDefault method:

public onRemove(event: RemoveEvent){
    event.preventDefault();
}

Then, a file/files can be removed programmatically through a removeFilesByUid method.

Regards,
Martin
Progress Telerik