RadUpload and RadWindow on the same page

Thread is closed for posting
4 posts, 1 answers
  1. Insomniac82
    Insomniac82 avatar
    18 posts
    Member since:
    Aug 2008

    Posted 04 Nov 2010 Link to this post

    Telerik,

    My team and I have been trying to decipher this paradox for a couple of days now, but unfortunately, all our efforts have ended being futile. I have RadUpload and RadWindow on the same ASPX page. The screen or logic flow is as follows:

    • User selects multiple images, using RadUpload
    • User clicks on preview button
    • Onclick event is captured in code-behind file; uploaded images are saved in session; javascript is injected, using RadAjaxManager; and RadWindow is triggered, which ultimately shows all the uploaded images.

    We are also disabling AJAX for RadAjaxPanel and RadAjaxManager in order for RadUpload to have a full post-back. One thing we have noticed that if we do not disable the AJAX for the preview button, everything works as expected. This behavior, however, forces the RadUpload.UploadedFiles property to show zero count -  even though several files are uploaded to the control.

    We were using 2010.2.713.35 version of Telerik.Web.UI assembly, and decided to update to 2010.2.929.35 build, which is latest build. The updates, however, did not solve the problem.

    We will be anxiously waiting to hear back from you.  

    The default page is as follows:

    <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
      
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
             <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
             <telerik:RadScriptBlock ID="RadCodeBlock1" runat="server">
                <script type="text/javascript">
      
      
                    function openEmergencyAlertDialog(caller) {   
                        var queryStr = "PreviewEmergencyAlert.aspx";
                        var oWnd = radopen(queryStr, caller);
                        return false;
                    }
      
                    function conditionalPostback(sender, args) {
      
                        if (args.get_eventTarget() == "<%= PreviewButton.UniqueID %>") {
                            args.set_enableAjax(false);
                            var manager = $find('<%= RadAjaxManager1.ClientID %>');
                            manager.set_enableAJAX(false);                        
                            setTimeout(function() {
                                manager.set_enableAJAX(true);
                            }, 0);
                        }
                    }
       
                </script>
        </telerik:RadScriptBlock>
               
         <telerik:radajaxmanager ID="RadAjaxManager1" runat="server" ClientEvents-OnRequestStart="conditionalPostback" >
              <AjaxSettings>
                 <telerik:AjaxSetting AjaxControlID="pnlStatus" >
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="pnlStatus" LoadingPanelID="RadAjaxLoadingPanel1" />
      
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
         </telerik:radajaxmanager>
          
        <telerik:radajaxloadingpanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Vista" Transparency="80"
          </telerik:radajaxloadingpanel
            
                <asp:Panel ID="pnlStatus" runat="server">
              <div style="padding-left:45px;" >
              
            <table width="900px">
                <tr>
                    <td>   
                      
                    <center><span style=" color:#0066cc; font-weight:bold; font-size:18px;">Header  </span>            
                    <span style="float:right; margin-top:-8px;margin-right:42px;  ">
      
                                <asp:LinkButton ID="PreviewButton" runat="server"  
                                     onclick="PreviewButton_Click"  Text="Preview" >   
                                </asp:LinkButton
                    </span>  
                   </center>
                    </td>
                </tr>
            </table>
              
            <!-- Start Download Image -->        
            <div style="height:10px;"></div>        
            <div style="padding-left:4px;"
      
                <table width="850px" border="0"  style="background:#75b458;">
                    <tr style="line-height:20px;">
                        <td style="width:152px;" valign="top">
                            <asp:Label ID="Label3" runat="server" Text="Upload Image(s):"></asp:Label
                        </td>
                        <td>
                            <span style="color:#fff;">Allowed extensions are: .gif, .jpg, .jpeg, .png, .bmp</span>
                            <div style="height:4px;">
                                  
                            </div>
                            <telerik:RadUpload ID="RadUpload1" Runat="server" MaxFileInputsCount="5" ControlObjectsVisibility = "ClearButtons"
                                                MaxFileSize="250000"
                                               AllowedFileExtensions=".gif,.jpg,.jpeg,.png,.bmp" >
                            </telerik:RadUpload>                           
                        </td>
                    </tr>
      
                </table>            
            </div>        
        </div>
          </asp:Panel>   
        </div>
          
        <telerik:RadWindowManager ID="radEAWindowManager" runat="server">    
                <Windows>
                    <telerik:RadWindow ID="radEmergencyAlert" Width="700px" Height="400px" AutoSize="false"
                    ShowContentDuringLoad="true" ReloadOnShow="true" VisibleStatusbar="false" runat="server"
                    Behaviors="Maximize,Close,Move,Resize,Reload" NavigateUrl="" KeepInScreenBounds="true" 
                    Modal="True" Title="Select Entity Actions">
                    </telerik:RadWindow>                 
                </Windows>                         
        </telerik:RadWindowManager>   
        </form>
    </body>
    </html>

    The code-behind

    protected void PreviewButton_Click ( object sender, EventArgs e )
       {
           if ( RadUpload1.UploadedFiles.Count > 0 )
           {
               List<byte[]> listImage = new List<byte [ ]> ( );
               foreach ( UploadedFile validFile in RadUpload1.UploadedFiles )
               {
                   Stream imageStream = validFile.InputStream;
                   int imageLength = validFile.ContentLength;
                   byte[] imageBinaryData = new byte [ imageLength ];
                   int n = imageStream.Read ( imageBinaryData, 0, imageLength );
                   listImage.Add ( imageBinaryData );
               }
           }
           RadAjaxManager1.ResponseScripts.Add ( "openEmergencyAlertDialog('radEmergencyAlert');" );
       }


    Thanks,

  2. Genady Sergeev
    Admin
    Genady Sergeev avatar
    1596 posts

    Posted 09 Nov 2010 Link to this post

    Hi Insomniac82,

    RadUpload cannot upload files using AJAX calls. This is a limitation of the XmlHttpRequest component, used in all AJAX frameworks for asynchronous calls to the application. In order to upload a file your application must perform a full page postback. This is the reason why the UploadedFiles collection shows zero. However, I am not quite sure that I understand the issue that you experience. Also, have in mind that once files are uploaded, they are no longer persisted in the UploadedFiles collection. They will stay there only in the postback that actually uploaded them.

    All the best,
    Genady Sergeev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Insomniac82
    Insomniac82 avatar
    18 posts
    Member since:
    Aug 2008

    Posted 09 Nov 2010 Link to this post

    Hi Genady,

    I appreciate your timely response. Yes, I know that there are certain limitations when using RadUpload Control, and I am very well aware of commanding full post back when uploading images, using RadUpload server  control. Your response, however, did not address the real problem that I am seeing.

    The only reason I copied, pasted the source code, so you Telerik support personnel could look at it. But apparently, it did not help. If you look at the default.aspx page, I am explicitly disabling and enabling AJAX to trigger post back from the client side, which is based on your guidelines available in online tutorials.

    Can somebody in your team try the default.aspx page and verify if the problem exists?

    PreviewEmergencyAlert.aspx inside openEmergencyAlertDialog function could be a simple HTML page.

    Thanks,
  5. Answer
    Genady Sergeev
    Admin
    Genady Sergeev avatar
    1596 posts

    Posted 12 Nov 2010 Link to this post

    Hi Insomniac82,

    Thank you for the sample code and please excuse me for not understanding your scenario correctly. I've managed to find the problem and it is not related to RadUpload at all. The problem is actually in the openEmergencyAlertDialog function. More specifically, this function is being called before there is instance of RadWindowManager created on the page. This happens because of the following script:

    RadAjaxManager1.ResponseScripts.Add("openEmergencyAlertDialog('radEmergencyAlert');");

    Instead, it should look like this:

    RadAjaxManager1.ResponseScripts.Add("Sys.Application.add_load(function() { openEmergencyAlertDialog('radEmergencyAlert'); });");

    For convenience, I've applied the changes to a sample page. You can find it attached to this ticket.



    All the best,
    Genady Sergeev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top