Telerik UI for ASP.NET AJAX

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.

  3. For each input element you add, assign it's id and name attributes to a 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:

CopyJavaScript
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;
}

CopyASPX
<telerik:RadAsyncUpload runat="server" id="RadAsyncUpload1" OnClientFileUploaded="onClientFileUploaded"></telerik:RadAsyncUpload>

Retrieving Field Values

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

Note

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:

 

See Also

Other Resources