How to get status message from Telerik MVC Upload Control
Jun 21, 2011

Download Telerik library from To see demo of uplod control, visit Reason to write this Blog: Many times we require to get some status message after saving files e.g. FileId from database. In this case when we pass non empty string from action, telerik considers it as error. Here in this blog i had mentioned steps to overcome this error. Telerik Upload control provides multiple files upload simultaneously sync/async.
.ClientEvents(t => t.OnError("UploadFile.error").OnUpload("UploadFile.Upload"))
.Async(t => t.AutoUpload(false)
.Remove("Remove", "UploadFiles")
.Save("Save", "UploadFiles")))
When we pass message from save(), it throws alert box with message “Error! Upload failed. Unexpected server response – see console.” To override it: 1:  Get Object Get the object of uploading control and override its existing method which generates error message.
var r = $("#UploadFile").data("tUpload");
r._alert = function (ee) { };
$("#UploadFile").data("tUpload", r);
_alert() is the function which generates error message when response from save() is non empty. 2:   Get response text from Save() As we return status, it will fire UploadFile.error().
UploadFile.error = function (e) {
UploadFile.filename = e.files[e.files.length - 1].name;
UploadFile.statusMsg = e.XMLHttpRequest.responseText;
if (e.XMLHttpRequest.responseText.indexOf("Success") < 0) {
UploadFile.Status = "error";
else {
UploadFile.Status = "success";
XMLHttpRequest.responseText is the value of status sent from Save() by which you can distinguish with actual uploading error or the successful status message. 3: Change Classes to get correct output Here, file is uploaded success fully. Though it shows with red mark as error. We need to work on Jquery to get correct output:
$(".t-file .t-fail").removeClass("t-fail").addClass("t-success");
$(".t-file .t-success").html("uploaded");
$(".t-file .t-success").parent().find('.t-retry').removeClass("t-retry").addClass("t-delete");
$(".t-file .t-success").parent().find(".t-delete").parent().html("<span class='t-icon t-delete'></span>delete”);
4: Override function _removeFileEntry()  to get more functionality When you click on delete button it will just remove the file list from div, and call Remove() of controller. But if you want to handle some features from Jquery, like remove FileId from list of FileId stored in hidden field, override _removeFileEntry() of telerik uploader as:
var r = $("#UploadFile").data("tUpload");
r._removeFileEntry = function (v) {};
$("#UploadFile").data("tUpload", r);


  1. Thanks a lot author.
    If you could show how you have in controller then it could more helpful.

    - Tshencho
    August 24, 2013 15:12

Leave a Reply

Your email address will not be published. Required fields are marked *


Related Posts

Evaluate expression using Reflection

Using Reflection we can evaluate an expression where value of the variables in…

Jun 8, 2010

How to open large XML files

Problem: Open large xml files without loading the whole xml file in memory…

Jun 9, 2010

Solve MS Ajax Script loading error in Safari & Chrome

Safari 3x and Google Chrome uses javascript engine called WebKit and which causes…

Jan 16, 2008

Copyright © Prakash Software Solutions Pvt. Ltd. All Rights Reserved.