New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Adding Information to Uploaded Files

You can add your own custom information to the files RadAsyncUpload uploads to the server.

Adding custom fields

To add custom fields to the uploaded files, use the OnClientFileUploaded client-side event to add controls to the RadAsyncUpload control where the user can enter the values:

  1. Use the get_row() method of the eventArgs to access each row that is added to the RadAsyncUpload control.

  2. Use the row to add input elements:

  • Add an input element of type "text" to add a text field to the uploaded file.

  1. For each input element you add, assign it's id and name attributes toa value that you obtain using the RadAsyncUpload.getID(name) method. The id and name must be generated by the RadAsyncUpload control so that it can locate the values on server-side.

The following example shows an OnClientFileUploaded event handler that add a text field elements:

var $ = $telerik.$;

function onClientFileUploaded(radAsyncUpload, args) {
    var $row = $(args.get_row());
    var inputName = radAsyncUpload.getAdditionalFieldID("TextBox");
    var inputType = "text";
    var inputID = inputName;
    var input = createInput(inputType, inputID, inputName);
    var label = createLabel(inputID);
    $row.append("<br/>");
    $row.append(label);
    $row.append(input);
}

function createInput(inputType, inputID, inputName) {
    var input = '<input type="'+ inputType + '" id="' +inputID+ '" name="' + inputName + '" />';
    return input;
}

function createLabel(forArrt) {
    var label = '<label for=' + forArrt + '>File info: </label>';
    return label;
}   
<telerik:RadAsyncUpload RenderMode="Lightweight" runat="server" id="RadAsyncUpload1" OnClientFileUploaded="onClientFileUploaded"></telerik:RadAsyncUpload>

Retrieving Field Values

Server-side, you can use the method UplodedFile.GetFieldValue(name) method.

Use the same value that was passed to the RadUpload.getID(name) method when retrieving a field value.

The following example shows how to retrieve the values the user entered for the custom fields added in the previous example:

protected void Button1_Click(object sender, EventArgs e) 
{  
    foreach (UploadedFile f in RadUpload1.UploadedFiles)  
    { 
        string fileName = f.GetName();
        string title = f.GetFieldValue("TextBox");    
        ProcessFile(fileName, title);  
    }
}               
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
    For Each f As UploadedFile In RadUpload1.UploadedFiles
        Dim fileName As String = f.GetName()
        Dim title As String = f.GetFieldValue("TextBox")
        ProcessFile(fileName, title)
    Next
End Sub 

See Also

In this article