After uploading file through Kendo Upload Remove "Done" and "Right tick mark" on select file

StackOverflow https://stackoverflow.com/questions/22708778

  •  23-06-2023
  •  | 
  •  

Question

I have a problem with Kendo upload. After uploading a file am getting "Done" and "Right tick mark" on select file right side. How can I remove that?

After save button click in my form upload control file is removing but "Done" and "Right tick mark" is staying constant.

 //Kendo Upload control
 @(Html.Kendo().Upload()
        .Name("files")       
        .Messages( m => m.Select("Browse"))     
        .Async(a => a
           .Save("SaveAttachment", "Document")
           .Remove("Remove", "Document")
            .AutoUpload(true)
        )
        .Events(events => events
            .Success("onSuccess")
        )
        .Multiple(false)
    ) 

  @(Html.Kendo().Upload()
        .Name("files")       
        .Messages( m => m.Select("Browse"))     
        .Async(a => a
           .Save("SaveAttachment", "Document")
           .Remove("Remove", "Document")
            .AutoUpload(true)
        )
        .Events(events => events
            .Success("onSuccess")
        )
        .Multiple(false)
    ) 
Was it helpful?

Solution

To remove the built-in text from a KendoUpload control, override the localization properties with an empty string. In your case, remove "Done":

$("#files").kendoUpload({
    multiple: true,
    async: {
        saveUrl: "...",
        removeUrl: "...", 
        autoUpload: false
    },
    localization: {
        // Override built-in text "Done"            
        headerStatusUploaded:"",
        statusUploaded:""
    }
    ...
});

OTHER TIPS

You can actually just use this

 $(".k-upload-status").remove();

Worked like a charm for me.

The following will remove the status row altogether.

 @(Html.Kendo().Upload()
                .Name("Files")
                .Async(a => a
                    .Save("SaveFiles", "Controller")
                    .AutoUpload(false)
                )
            .Events(x=>x.Complete("onUploadComplete"))
        )
    <script type="text/javascript">
    function onUploadComplete(e) {
        var fileStatusRow = $("#uploadContainer ul.k-upload-files");
        fileStatusRow.hide('slow', function () { fileStatusRow.remove(); });
    }
    </script>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top