This is a migrated thread and some comments may be shown as answers.

How to add a combobox to the upload control

3 Answers 180 Views

Upload (Obsolete)

This is a migrated thread and some comments may be shown as answers.

Dan Harvey asked on 16 Jan 2012, 10:58 PM

Hello,

I would like to add a simple combox (not telerik) with items in it as an additional field to the RadUpload control.

Here is my code:

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="MultiFileUploadPrototype._Default" %>

<%@ register tagprefix="telerik" namespace="Telerik.Web.UI" assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/tr/xhtml11/dtd/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

<link rel="stylesheet" type="text/css" href="styles.css" />

</head>

<body class="BODY">

<form runat="server" id="mainForm" method="post">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

<telerik:RadProgressManager ID="Radprogressmanager1" runat="server" />

<table>

<tr>

<td class="TopCell" colspan="2">

</td>

</tr>

<tr>

<td class="BodyCell">

<div class="FileDetails">

<telerik:RadAsyncUpload runat="server"

id="RadAsyncUpload1"

OnClientFileUploaded="onClientFileUploaded"

MultipleFileSelection="Automatic">

</telerik:RadAsyncUpload>

</div>

</td>

<td class="BodyCell RightCell">

<div class="uploadedfiles">

<div>

<asp:Label ID="labelNoResults" runat="server" Visible="True">No uploaded files</asp:Label>

<asp:Repeater runat="server" ID="Repeater1">

<ItemTemplate>

Category: <%#((Telerik.Web.UI.UploadedFile)Container.DataItem).GetFieldValue("TextBox").ToString()%>,<br />

File name: <%# DataBinder.Eval(Container.DataItem, "FileName").ToString() %>,<br />

File size: <%# DataBinder.Eval(Container.DataItem, "ContentLength").ToString() %><br />

<br />

</ItemTemplate>

</asp:Repeater>

</div>

</td>

</tr>

<tr>

<td class="BottomCell" colspan="2">

<asp:Button ID="buttonSubmit" runat="server" CssClass="RadUploadButton" OnClick="buttonSubmit_Click" Text="Submit" />

</td>

</tr>

</table>

<telerik:RadProgressArea runat="server" ID="ProgressArea1"></telerik:RadProgressArea>

<script type="text/javascript">

var $ = $telerik.$;

function onClientFileUploaded(radAsyncUpload, args) {

var $row = $(args.get_row());

var categoryInputName = radAsyncUpload.getAdditionalFieldID("TextBox");

var categoryInputType = "text";

var categoryInputID = categoryInputName;

var categoryInput = createInput(categoryInputType, categoryInputID, categoryInputName);

var categoryLabel = createLabel(categoryInputID, "Category");

// var subCategoryInputName = radAsyncUpload.getAdditionalFieldID("ComboBox");

// var subCategoryInputID = subCategoryInputName;

// var subCategoryInput = createComboBox(subCategoryInputID);

// var subCategoryLabel = createLabel(subCategoryInputID, "Category");

$row.append("<br/>");

$row.append(categoryLabel);

$row.append(categoryInput);

// $row.append("<br/>");

// $row.append(subCategoryLabel);

// $row.append(subCategoryInput);

}

function createInput(inputType, inputID, inputName) {

var input = '<input type="' + inputType + '" id="' + inputID + '" name="' + inputName + '" />';

return input;

}

// function createComboBox(inputID) {

// var cmbBox = '<telerik:RadComboBox id="' + inputID + '" />';

// return cmbBox;

// }

function createLabel(forArrt, labelName) {

var label = '<label for=' + forArrt + '>' + labelName + ': </label>';

return label;

}

</script>

</form>

</body>

</html>

Please help.

Thanks,

3 Answers, 1 is accepted

answered on 18 Jan 2012, 05:52 PM

Dan:

The rad combo box in radUpload forum thread states that it is far simpler to use standard ASP.NET controls than to implement RadControls in association with the RadUpload control. But, most importantly, the additional fields must provide text or boolean values.

I'm thinking that you should let the ASP ComboBox initiate the postback and trigger the upload, instead of a "Submit" button. Then, on the server-side, you'd subscribe to one of it's events to get the selected text value and do something with it.

You'd have to insure that a file has been selected prior to enabling the combobox to prevent postback without a file.

I am working on a simple sample and will update this thread soon, as time permits.

Cheers!