FileExplorer, Document Manager, and Image Manager display an error message when a file upload fails

[lan luo]

Hello,

One of our customers reported that they are trying to enhance the security features for file uploads in RadFileExplorer, Document Manager, and Image Manager. Specifically, for SVG files, they want to inspect the file contents for any embedded JavaScript functions. If the file is deemed unsafe, the upload should fail, and an error message should be displayed to the end user.

We have implemented the necessary backend validation and are able to throw an error message. However, we have not found a way to display this error message in the UI. Is there a recommended approach for implementing error message display in this scenario?

Thanks,

Lan

[Rumen]

Hi Lan,

You can attach the OnClientFileUploadFailed error handler to the AsyncUpload used in the Image Manager and provide the error message which will be thrown when uploading the file. You can access the AsyncUpload control in the FileBrowser dialogs of RadEditor using as a base the code solution provided in this KB article: Displaying single upload control in the FileBrowser Upload manager.

Here is an example how to attach the OnClientFileUploadFailed error handler to the AsyncUpload:

UserControl.ascx

C#

<script runat="server" type="text/C#">
    protected void Page_Load(object sender, EventArgs args)
    {
        Telerik.Web.UI.RadFileExplorer rfe = FindRadControl(this.Page) as Telerik.Web.UI.RadFileExplorer;

        if (rfe != null)
        {
            rfe.AsyncUpload.OnClientFileUploadFailed = "OnClientFileUploadFailed";
        }
    }

    private Control FindRadControl(Control parent)
    {
        foreach (Control c in parent.Controls)
        {
            if (c is Telerik.Web.UI.RadFileExplorer) return c;

            if (c.Controls.Count > 0)
            {
                Control sub = FindRadControl(c);
                if (sub != null) return sub;
            }
        }

        return null;
    }
</script>

<script>
function OnClientFileUploadFailed(sender, args) {
  alert(args.get_message()); // this line will alert the error that you get when trying to upload a file
}
</script>

VB

<script runat="server" type="text/VB">
    Protected Sub Page_Load(ByVal sender As Object, ByVal args As System.EventArgs)
        Dim rfe As Telerik.Web.UI.RadFileExplorer = CType(Me.FindRadControl(Me.Page), Telerik.Web.UI.RadFileExplorer)
 
        If rfe IsNot Nothing Then
            rfe.AsyncUpload.OnClientFileUploadFailed= "OnClientFileUploadFailed"
        End If
    End Sub
 
    Private Function FindRadControl(ByVal parent As Control) As Control
        For Each c As Control In parent.Controls
            If TypeOf c Is Telerik.Web.UI.RadFileExplorer Then Return c
 
            If c.Controls.Count > 0 Then
                Dim [sub] As Control = FindRadControl(c)
                If [sub] IsNot Nothing Then Return [sub]
            End If
        Next
 
        Return Nothing
    End Function
</script>
<script>
function OnClientFileUploadFailed(sender, args) {
  alert(args.get_message()); //this line will alert the error that you get when trying to upload a file
}
</script>

Regards,
Rumen
Progress Telerik

[Judy]

Hello Rumen,

Thank you for your reply.

I tested the OnClientFileUploadFailed function, and it appears that this method is triggered when a file fails immediately upon selection in the popup window. However, our intended behavior is different: after all files are selected, the user clicks the Upload button (as highlighted in the attached image), and only then should the server perform validation. If any file fails validation at the backend, an appropriate error message should be displayed.

Is there a way to implement this behavior?

Thanks,

Lan

[Rumen]

Hi Lan,

You can register a JavaScript alert directly inside the FileBrowserContentProvider.StoreFile method using the  ScriptManager.RegisterStartupScript method. You can check my reply here and use it as a base for your custom implementation: 

https://www.telerik.com/forums/how-to-add-an-alert-in-the-filestore-method-in-telerik-file-explorer#5951989 

 

Regards,
Rumen
Progress Telerik

[Judy]

It works! Thank you Rumen!

Lan