[Solved] RadUpload/RadGrid ProgressArea issue

[Lynne]

My web page has a section containing a RadGrid control and another section containing a RadUpload control.  Initially, the RadProgress area would not display at all when I clicked the RadButton to submit, but it randomly displayed when I clicked edit or delete on the RadGrid.  I resolved this by adding client side script to the RadGrid OnCommand event to hide the progress area, and to the RadProgressManager OnClientSubmitting event to show the progress area (not sure if this was a great idea, but it's all I could make work).

Now that my progress area is displaying consistently, my problem is that none of the values are populated - current file, total progress, file count, etc. are all blank and the progress bar always displays as if 100%.    I've pasted the content of my aspx file below - it is rather lengthy, but I didn't want to omit anything.

Any suggestions would be appreciated. 

 

 

 

 

<form id="form1" runat="server">




<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server"></telerik:RadStyleSheetManager>



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



<telerik:RadFormDecorator ID="RadFormDecorator1" Skin="Web20" runat="server" />



<div id="outer">



<div id="middle">



<div id="inner">



<asp:Table ID="Table2" runat="server" CellPadding="0" CellSpacing="0" Width="938px">



<asp:TableRow VerticalAlign="top" Height="3%" Width="100%">



<asp:TableCell>



<table class="AltBody" style="width: 100%;padding:0px;margin:0px;height:100%;font-weight:bold;">



<tr>



<td style="width: 5%; height: 30px;">



<img src="Images/logo2.gif" alt="tenetlogo" height="35px;" />



</td>



<td align="center" valign="middle" class="AppHeaderName" style="width: 80%;">



<asp:Label ID="Label1" runat="server" Width="600px" Height="25px" Text="PDR102 Documentation Editor"></asp:Label>



</td>



<td style="width: 15%; text-align: center;" valign="top">



<asp:LinkButton ID="btnLogout" runat="server" CausesValidation="false" OnClick="btnLogout_Click">



<asp:Image ID="img_logout" ImageUrl="Images/logout.png" runat="server" Width="16"



Height="16" />



Logout</asp:LinkButton>



</td>



</tr>



</table>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow VerticalAlign="top" Width="100%">



<asp:TableCell Width="100%" CssClass="minsize">



<br />



<fieldset style="width:97%; margin-left:10px;">



<asp:Table ID="table3" runat="server" CellPadding="0" CellSpacing="10" Width="100%" >



<asp:TableRow HorizontalAlign="Center">



<asp:TableCell ColumnSpan="3">



<h3><asp:Label ID="lblTitle" runat="server" CssClass="Label" Text="Report Documentation for "></asp:Label></h3>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%" HorizontalAlign="Left">



<asp:TableCell ColumnSpan="3">



<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" AllowFilteringByColumn="false"



AllowPaging="false" AllowSorting="false" Skin="Windows7" GridLines="None"



OnItemCreated="RadGrid1_ItemCreated"



OnUpdateCommand="RadGrid1_UpdateCommand" OnNeedDataSource="RadGrid1_NeedDataSource"



OnDeleteCommand="RadGrid1_DeleteCommand" OnItemDataBound="RadGrid1_ItemDataBound"

ShowStatusBar="true" >



<ClientSettings>



<ClientEvents OnCommand="OnCommand" />



</ClientSettings>



<MasterTableView AutoGenerateColumns="False" EditMode="InPlace" AllowFilteringByColumn="false"



ExpandCollapseColumn-Display="false" CommandItemDisplay="None">




<Columns>



<telerik:GridBoundColumn DataField="PDRDocumentLinkID" UniqueName="PDRDocumentLinkID" Visible="false">



</telerik:GridBoundColumn>



<telerik:GridTemplateColumn DataField="URL" DataType="System.String" UniqueName="URL" HeaderText="URL">



<EditItemTemplate>



<telerik:RadTextBox ID="URL" runat="server" Text='<%#Bind("URL") %>' MaxLength="250">



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="URLRequiredFieldValidator" runat="server" ControlToValidate="URL"

ErrorMessage="URL is required" />



</EditItemTemplate>



<ItemTemplate>



<asp:Label ID="URLLabel" runat="server" Text='<%# Eval("URL") %>'></asp:Label>



</ItemTemplate>



</telerik:GridTemplateColumn>



<telerik:GridTemplateColumn DataField="URLDescription" DataType="System.String" UniqueName="URLDescription" HeaderText="URL Description">



<EditItemTemplate>



<telerik:RadTextBox ID="URLDescription" runat="server" Text='<%#Bind("URLDescription") %>' MaxLength="250">



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="URLDescRequiredFieldValidator" runat="server" ControlToValidate="URLDescription"

ErrorMessage="URL Description is required" />



</EditItemTemplate>



<ItemTemplate>



<asp:Label ID="URLDescLabel" runat="server" Text='<%# Eval("URLDescription") %>'></asp:Label>



</ItemTemplate>



</telerik:GridTemplateColumn>



<telerik:GridTemplateColumn DataField="Description" DataType="System.String" UniqueName="Description" HeaderText="Description">



<EditItemTemplate>



<telerik:RadTextBox ID="Description" runat="server" Text='<%#Bind("Description") %>'>



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="DescRequiredFieldValidator" runat="server" ControlToValidate="Description"

ErrorMessage="Description is required" />



</EditItemTemplate>



<ItemTemplate>



<asp:Label ID="DescLabel" runat="server" Text='<%# Eval("Description") %>'></asp:Label>



</ItemTemplate>



</telerik:GridTemplateColumn>



<telerik:GridTemplateColumn DataField="EffectiveDate" DataType="System.DateTime"



FilterControlAltText="Filter EffectiveDate column" HeaderText="Effective Date"



UniqueName="EffectiveDate">



<EditItemTemplate>



<telerik:RadDatePicker ID="EffectiveDate" runat="server" DbSelectedDate='<%#Bind("EffectiveDate") %>'>



</telerik:RadDatePicker>



<br />



<asp:RequiredFieldValidator ID="EffDateRequiredFieldValidator" runat="server" ControlToValidate="EffectiveDate"

ErrorMessage="Effective Date is required" />



</EditItemTemplate>



<ItemTemplate>



<asp:Label ID="EffectiveDateLabel" runat="server" Text='<%# Eval("EffectiveDate") %>'></asp:Label>



</ItemTemplate>



</telerik:GridTemplateColumn>



<telerik:GridTemplateColumn DataField="Type" DataType="System.String" UniqueName="Type" HeaderText="Type">



<EditItemTemplate>



<telerik:RadTextBox ID="Type" runat="server" Text='<%#Bind("Type") %>' MaxLength="25">



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="TypeRequiredFieldValidator" runat="server" ControlToValidate="Type"

ErrorMessage="Type is required" />



</EditItemTemplate>



<ItemTemplate>



<asp:Label ID="TypeLabel" runat="server" Text='<%# Eval("Type") %>'></asp:Label>



</ItemTemplate>



</telerik:GridTemplateColumn>



<telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">



<ItemStyle CssClass="MyImageButton" />



</telerik:GridEditCommandColumn>



<telerik:GridButtonColumn ConfirmText="Delete this document?" ConfirmDialogType="RadWindow"



ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete"



UniqueName="DeleteColumn">



<ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />



</telerik:GridButtonColumn>



</Columns>



<EditFormSettings>



<EditColumn UniqueName="EditCommandColumn1" FilterControlAltText="Filter EditCommandColumn1 column">



</EditColumn>



</EditFormSettings>



</MasterTableView>



<FilterMenu EnableImageSprites="False">



</FilterMenu>



<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Windows7">



</HeaderContextMenu>



</telerik:RadGrid>



</asp:TableCell>



</asp:TableRow>



</asp:Table>

</fieldset>

</asp:TableCell>



</asp:TableRow>



<asp:TableRow VerticalAlign="top" Width="100%" Height="100%">



<asp:TableCell Width="100%" CssClass="minsize">



<br />



<fieldset style="width:97%; margin-left:10px; height:100%" >



<asp:Table ID="table1" runat="server" CellPadding="0" CellSpacing="10" >



<asp:TableRow HorizontalAlign="Center" Width="100%">



<asp:TableCell Width="20%"></asp:TableCell>



<asp:TableCell ColumnSpan="2" HorizontalAlign="Center">



<h3><asp:Label ID="lblAddDoc" runat="server" CssClass="Label">Add New Document/Link</asp:Label></h3>



<h6><asp:Label ID="lblInstructions" runat="server" ForeColor="#4c607a"

Text="**Select a Document OR leave Document blank and enter the URL for an existing document."></asp:Label></h6>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%">



<asp:TableCell Width="20%"></asp:TableCell>



<asp:TableCell Width="20%">



<asp:Label runat="server" ID="lblUpload" Text="Document" CssClass="Label"></asp:Label>



</asp:TableCell>



<asp:TableCell Width="60%">



<telerik:RadProgressManager ID="RadProgressManager1" runat="server" OnClientProgressUpdating="ProgressCheck"

OnClientSubmitting="OnClientSubmitting" />



<telerik:RadUpload ID="RadUpload1" runat="server" MaxFileInputsCount="1"

OverwriteExistingFiles="true" OnClientFileSelected="CheckURL"



AllowedFileExtensions=".doc,.docx,.pdf,.xls,.xlsx,.txt"

ControlObjectsVisibility="ClearButtons" Skin="Web20"

MaxFileSize="60000000" ReadOnlyFileInputs="True" TargetFolder="~/UploadedFiles" >



</telerik:RadUpload>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%">



<asp:TableCell></asp:TableCell>



<asp:TableCell>



<asp:Label runat="server" ID="lblURL" Text="URL" CssClass="Label"></asp:Label>



</asp:TableCell>



<asp:TableCell>



<telerik:RadTextBox ID="rtbURL" runat="server" Width="400px" Skin="Web20" >



</telerik:RadTextBox>



<br />



<asp:CustomValidator ID="URLCustomValidator" runat="server"

ClientValidationFunction="ValidateURL" EnableClientScript="true" ValidateEmptyText="true"



ControlToValidate="rtbURL"



ErrorMessage="URL is required if a Document is not selected" ForeColor="Red">



</asp:CustomValidator>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%" >



<asp:TableCell></asp:TableCell>



<asp:TableCell>



<asp:Label runat="server" ID="lblURLDescription" Text="URL Description" CssClass="Label"></asp:Label>



</asp:TableCell>



<asp:TableCell>



<telerik:RadTextBox ID="rtbURLDescription" runat="server" MaxLength="250" Width="400px" Skin="Web20" >



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="URLDescRequiredFieldValidator" runat="server" ControlToValidate="rtbURLDescription"



SetFocusOnError="true" ForeColor="red" ErrorMessage="URL Description is required"></asp:RequiredFieldValidator>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%" >



<asp:TableCell></asp:TableCell>



<asp:TableCell>



<asp:Label runat="server" ID="lblDescription" Text="Description" CssClass="Label"></asp:Label>



</asp:TableCell>



<asp:TableCell>



<telerik:RadTextBox ID="rtbDescription" runat="server" Width="400px" Skin="Web20" TextMode="MultiLine" Rows="2" Wrap="true">



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="DescriptionRequiredFieldValidator" runat="server" ControlToValidate="rtbDescription"



SetFocusOnError="true" ForeColor="red" ErrorMessage="Description is required"></asp:RequiredFieldValidator>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%" >



<asp:TableCell></asp:TableCell>



<asp:TableCell>



<asp:Label runat="server" ID="lblEffDate" Text="Effective Date" CssClass="Label"></asp:Label>



</asp:TableCell>



<asp:TableCell>



<telerik:RadDatePicker ID="rdpEffectiveDate" runat="server" Skin="Web20">



</telerik:RadDatePicker>



<br />



<asp:RequiredFieldValidator ID="EffDateRequiredFieldValidator" runat="server" ControlToValidate="rdpEffectiveDate"

ForeColor="Red" ErrorMessage="Effective Date is required" />



</asp:TableCell>



</asp:TableRow>



<asp:TableRow Width="100%" >



<asp:TableCell></asp:TableCell>



<asp:TableCell>



<asp:Label runat="server" ID="lblType" Text="Type" CssClass="Label"></asp:Label>



</asp:TableCell>



<asp:TableCell>



<telerik:RadTextBox ID="rtbType" runat="server" MaxLength="25" Width="50px" Skin="Web20">



</telerik:RadTextBox>



<br />



<asp:RequiredFieldValidator ID="TypeRequiredFieldValidator" runat="server" ControlToValidate="rtbType"



SetFocusOnError="true" ForeColor="red" ErrorMessage="Type is required"></asp:RequiredFieldValidator>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow>



<asp:TableCell ColumnSpan="3" HorizontalAlign="Center">



<telerik:RadProgressArea ID="RadProgressArea1" runat="server"

DisplayCancelButton="True"

ProgressIndicators="TotalProgressBar,TotalProgressPercent,RequestSize,TransferSpeed,CurrentFileName,TimeElapsed,TimeEstimated"



Skin="Web20" HeaderText="Upload Progress" >



</telerik:RadProgressArea>



</asp:TableCell>



</asp:TableRow>



<asp:TableRow HorizontalAlign="Center">



<asp:TableCell></asp:TableCell>



<asp:TableCell ColumnSpan="2">



<telerik:RadButton ID="btnSave" runat="server" Width="175px" Font-Size="Small" Skin="Web20"



Text="Save Document" OnClick="btnSave_Click">



</telerik:RadButton>







<telerik:RadButton ID="btnReturn" runat="server" Width="175px" Font-Size="Small"



Skin="Web20" Text="Select New Report" OnClick="btnReturn_Click" CausesValidation="false" UseSubmitBehavior="false">



</telerik:RadButton>



</asp:TableCell>



</asp:TableRow>



</asp:Table>



</fieldset>

</asp:TableCell>



</asp:TableRow>



</asp:Table>

</div>

</div>

</div>



<script type="text/javascript">



function OnCommand(sender, eventArgs) {

//Hide the RadProgressArea when grid commands are fired.

var progressarea = $find("<%=RadProgressArea1.ClientID %>");

progressarea.hide();

}



function ProgressCheck(progressManager, args) {

alert('progress check');

}

function ValidateURL(sender, args) {

//URL is required if a file has not been selected for upload.



var url = $find("<%= rtbURL.ClientID %>");

var fileInputs = $find("<%= RadUpload1.ClientID %>").getFileInputs();

for (var i = 0; i < fileInputs.length; i++) {

if (fileInputs[i].value == "" && url.get_value() == "") {

args.IsValid = false;

return;

}

}

args.IsValid = true;

}



function CheckURL(radUpload, eventArgs) {

//If a file is selected for upload, clear out the URL because it will be populated automatically.



var url = $find("<%= rtbURL.ClientID %>");

url.set_value("");

}

function OnClientSubmitting(progressManager, args) {



//This gets called when Save or Select New Report buttons are clicked.



//It clears the files to be uploaded if the Select New Report button is clicked.



var eventTarget = document.getElementById('__EVENTTARGET');

if (eventTarget.value == '<%= btnReturn.UniqueID %>') {

//Clear the file inputs



var upload = $find("<%= RadUpload1.ClientID %>");

var fileInputs = upload.getFileInputs();

for (var i = 0; fileInputs.length > i; i++) {

upload.clearFileInputAt(i);

}

}

else if (eventTarget.value == '<%= btnSave.UniqueID %>') {

var progressarea = $find("<%=RadProgressArea1.ClientID %>");

progressarea.show();

}

}



</script>

</form>



</body>

</html>

[Bozhidar]

Hello Lynne,

Unfortunately the page you sent cannot be run, because the code behind file is missing. Could you try to isolate the problem in a runnable sample solution and send it, so that I can investigate the issue locally. It would be helpful if you made the page as simple as possible, while still reproducing the issue.

You can also check the following help article, which discusses common issues with RadProgressArea:
http://www.telerik.com/help/aspnet-ajax/upload-progressarea-known-limitations.html 
 
Kind regards,
Bozhidar
the Telerik team