RadUpload inside a grid

Thread is closed for posting
5 posts, 0 answers
  1. Rodrigo Morales
    Rodrigo Morales avatar
    3 posts
    Member since:
    Jan 2010

    Posted 18 Jan 2010 Link to this post

    Hi,
    I can't make a RadUpload work inside a RadGrid. I tried in at least two different ways:

    In the first try I just added my RadUpload with a MaxCountofInputFiles = 1. Then, in the behind code, I just tried to find the radUpload control

    RadUpload upload = (RadUpload)e.Item.FindControl("UploadControl");

    and tried to use the upload.UploadedFiles collection. However, the UploadedFiles collection is ALWAYS empty using this approach.

    The other approach is the one used in the image example, but it didn't work. The UploadedFiles collection is still empty anyway. Below are the grid and the code behind.

    <script type="text/javascript">   
                //<![CDATA[
           
                function conditionalPostback(e, sender) {
                   
                    var theRegexp = new RegExp("\.UpdateButton$|\.PerformInsertButton$", "ig");
                    if (sender.get_eventTarget().match(theRegexp)) {
                        var upload = $find(window['UploadControl']);
                        //AJAX is disabled only if file is selected for upload
                        if (upload.getFileInputs()[0].value != "") {
                            sender.set_enableAjax(false);
                        }
                    }
                }
                function validateRadUpload(source, e) {
                    alert("true");
                    e.IsValid = false;
                    alert("Entro al metodo culero");
                    var upload = $find(source.parentNode.getElementsByTagName('div')[0].id);
                    var inputs = upload.getFileInputs();
                    for (var i = 0; i < inputs.length; i++) {
                        //check for empty string or invalid extension
                        if (inputs[i].value != "" && upload.isExtensionValid(inputs[i].value)) {
                            alert(inputs[i].value);
                            e.IsValid = true;
                            break;
                        }
                    }
                }
                //]]> 
         </script>  
          
                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">   
                <AjaxSettings>  
                    <telerik:AjaxSetting AjaxControlID="DefaultMasterScriptManager">   
                        <UpdatedControls>  
                            <telerik:AjaxUpdatedControl ControlID="dgFileUploader" />  
                        </UpdatedControls>  
                    </telerik:AjaxSetting>  
                </AjaxSettings>  
            </telerik:RadAjaxManager>  
             
               <h2>File Uploader</h2><br /> 
                    <telerik:RadAjaxPanel ID="FileUploaderPanel" runat="server" ClientEvents-OnRequestStart="conditionalPostback"
                    <telerik:RadInputManager ID="RadInputManager2" runat="server"
                        <telerik:RegExpTextBoxSetting BehaviorID="RegExpItemName" InitializeOnClient="false" 
                            ErrorMessage="Invalid format" InvalidCssClass="invalid" 
                            ValidationExpression="([A-Za-z]([A-Za-z0-9])*)"
                        <Validation IsRequired="true" />  
                        </telerik:RegExpTextBoxSetting>                      
                    </telerik:RadInputManager> 
                    <telerik:RadGrid ID="dgFileUploader" DataSourceID="FileUploaderDataSource" runat="server"  
                        AutoGenerateColumns="False" GridLines="None" AllowAutomaticDeletes="True" AllowAutomaticInserts="False"  
                        Skin="Outlook"  
                        onitemcommand="dgFileUploader_ItemCommand"  
                        onitemcreated="dgFileUploader_ItemCreated"                      
                        OnItemDataBound="dgFileUploader_ItemDataBound"                      
                        > 
                    <HeaderContextMenu EnableTheming="True"
                        <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
                    </HeaderContextMenu> 
     
                    <MasterTableView CommandItemDisplay="Top" DataKeyNames ="Id" DataSourceID="FileUploaderDataSource"
                        <CommandItemTemplate>   
                          <asp:LinkButton ID="LinkButton2" runat="server" CommandName="InitInsert" Visible='<%# !dgFileUploader.MasterTableView.IsItemInserted %>'
                            Add New Record 
                          </asp:LinkButton><br /> 
                        </CommandItemTemplate> 
                    <RowIndicatorColumn> 
                        <HeaderStyle Width="20px"></HeaderStyle> 
                    </RowIndicatorColumn> 
     
                    <ExpandCollapseColumn> 
                        <HeaderStyle Width="20px"></HeaderStyle> 
                    </ExpandCollapseColumn> 
             
                    <Columns> 
                        <telerik:GridBoundColumn DataField="ItemName" HeaderText="Item Name" SortExpression="ItemName"
                        </telerik:GridBoundColumn> 
                        <telerik:GridBoundColumn DataField="UploadDate" HeaderText="Upload Date(mm/dd/yyyy)" SortExpression="UploadDate" DataType="System.DateTime"
                        </telerik:GridBoundColumn> 
                        <telerik:GridBoundColumn DataField="OriginalFileName" HeaderText="Original File Name" SortExpression="OriginalFileName"
                        </telerik:GridBoundColumn> 
                         <telerik:GridButtonColumn UniqueName="Delete" ButtonType="LinkButton" CommandName="Delete" Text="Remove"
                        </telerik:GridButtonColumn> 
                    </Columns> 
         
                    <EditFormSettings EditFormType="Template"
                        <EditColumn UniqueName="EditCommandColumn1"></EditColumn> 
                        <FormTemplate> 
                            <table cellspacing="2" cellpadding="1" width="100%" border="0"
                                <tr> 
                                    <td> 
                                        Item Name: 
                                    <asp:TextBox Width="200px" ID="ItemNameTextBox" runat="server" EnableViewState="true" Text=""></asp:TextBox> 
                                    <%--asp:requiredfieldvalidator id="ReqTextBox1" runat="server" ErrorMessage="Item Name is required field" 
                                        EnableClientScript="False" ControlToValidate="TextBox1" Display="Static"></asp:requiredfieldvalidator--%> 
                                        <br /> 
                                        <telerik:RadProgressManager ID="RadProgressManager1" runat="server" />  
                                        <telerik:RadUpload InputSize="100" CssClass="content" ID="UploadControl" EnableViewState="true" runat="server" AllowedFileExtensions=".doc,.docx" ControlObjectsVisibility="None" OverwriteExistingFiles="True" MaxFileInputsCount="1"
                                        </telerik:RadUpload> 
                                        <telerik:RadProgressArea ID="ProgressArea" runat="server" />  
                                     </td> 
                                </tr>                    
                                <tr> 
                                    <td> 
                                        <asp:LinkButton ID="Button3" runat="server" Text='<%# (Container is GridEditFormItem) ? "Save" : "Update" %>' 
                                            CommandName='<%# (Container is GridEditFormItem) ? "PerformInsert" : "Update" %>'></asp:LinkButton> 
                                        <asp:LinkButton ID="Button4" runat="server" Text="Cancel" CausesValidation="false" 
                                            CommandName="Cancel"></asp:LinkButton> 
                                    </td> 
                                </tr> 
                            </table> 
                        </FormTemplate> 
                    </EditFormSettings> 
                </MasterTableView> 
                 
                <FilterMenu EnableTheming="True"
                    <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
                </FilterMenu> 
            </telerik:RadGrid> 
            <pp:ObjectContainerDataSource ID="FileUploaderDataSource" runat="server"  
                DataObjectTypeName = "FacultyPortalService.BusinessEntities.FileUploader" runat="server"  
                OnDeleted="FileUploader_Deleted"  
                /> 
            </telerik:RadAjaxPanel> 

    As you can see, I'm taking the Script manager from a Master page. That script manager is an asp:scriptmanager.

    Below are the Page_load, the Item Data Bound and the itemcommand and created.

     
            protected void Page_Load(object sender, EventArgs e) 
            { 
                if (!this.IsPostBack) 
                { 
                    this._presenter.OnViewInitialized(); 
                } 
     
                profileVitaeTab.Visible = !_presenter.ProfileApprovalInReview(); 
     
                this._presenter.OnViewLoaded(); 
     
                if (!IsPostBack) 
                { 
                    this.dgFileUploader.DataBind(); 
                    this.DataBind(); 
                } 
     
            } 
     
            protected void dgFileUploader_ItemDataBound(object sender, GridItemEventArgs e) 
            { 
               
             if (e.Item is GridEditableItem && e.Item.IsInEditMode ) 
             { 
                 RadUpload upload = (RadUpload)e.Item.FindControl("UploadControl"); 
                FreelanceItemPanel.ResponseScripts.Add(String.Format("window['UploadControl'] = '{0}';", upload.ClientID));  
     
             } 
            } 
             
                   protected void dgFileUploader_ItemCommand(object source, GridCommandEventArgs e) 
            { 
                if (e.CommandName == RadGrid.InitInsertCommandName) //"Add new" button clicked 
                { 
                    e.Canceled = true
                    e.Item.OwnerTableView.InsertItem(); 
                    GridEditableItem insertedItem = e.Item.OwnerTableView.GetInsertItem(); 
                } 
     
                if (e.Item.ItemType == GridItemType.EditFormItem)  
                { 
                    if (e.CommandName == RadGrid.PerformInsertCommandName) 
                    { 
                        //e.Canceled = false; 
                        //BindInvalidFiles(); 
                        var itemNameTextBox = (TextBox)e.Item.FindControl("ItemNameTextBox"); 
                        var radUploadControl = (RadUpload)e.Item.FindControl("UploadControl"); 
     
                        if (itemNameTextBox == null || radUploadControl == null
                        { 
                            return
                        } 
                         
                        ParseFile(radUploadControl.UploadedFiles, itemNameTextBox.Text, 1); 
                    } 
                } 
            } 
     
            protected void dgFileUploader_ItemCreated(object sender, GridItemEventArgs e) 
            { 
                if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
                { 
                    GridEditFormItem editedItem = e.Item as GridEditFormItem; 
     
                    TextBox txt1 = editedItem.FindControl("ItemNameTextBox"as TextBox; 
                    RegExpTextBoxSetting regExpSetting = (RegExpTextBoxSetting)RadInputManager2.GetSettingByBehaviorID("RegExpItemName"); 
                    regExpSetting.TargetControls.Add(new TargetInput(txt1.UniqueID, true)); 
                } 
     
                if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
                { 
                    GridEditableItem editItem = (GridEditableItem)e.Item; 
                    RadUpload upload = (RadUpload)e.Item.FindControl("UploadControl"); 
                    CustomValidator validator = new CustomValidator(); 
                    validator.ErrorMessage = "Please select file to be uploaded"
                    validator.ClientValidationFunction = "validateRadUpload"
                    validator.Display = ValidatorDisplay.Dynamic; 
     
                    ((WebControl)upload.Parent).Controls.Add(validator); 
     
                } 
            } 

    Warmest Regards

  2. Genady Sergeev
    Admin
    Genady Sergeev avatar
    1596 posts

    Posted 19 Jan 2010 Link to this post

    Hello Rodrigo Morales,

    Do you modify the MasterPage ID during OnInit? Can you try to access the uploaded files using Telerik.Web.UI.RadUploadContext.UploadedFiles, are there files in the collection?

    I can see that you AJAXify your grid both with RadAjaxManager and RadAjaxPanel. You will need to attach the conditionalPostback function to the AJAX manager as well.

    All the best,
    Genady Sergeev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Rodrigo Morales
    Rodrigo Morales avatar
    3 posts
    Member since:
    Jan 2010

    Posted 26 Jan 2010 Link to this post

    We could make it work. To do so, we removed the RadAjaxManager and its inside components. The conditional postback was already in the panels. The big difference was the RadAjaxManager.

    Regards,
    Rodrigo Morales.
  5. Osmon
    Osmon avatar
    10 posts
    Member since:
    Aug 2010

    Posted 20 Sep 2010 Link to this post

    Hi,
           I have the same senario. I have a radajaxmanager in the master page and a radajaxPanel in the contentpage having the radgrid that has radupload.
          Now, everything is working fine except the client validation for the radupload stop working since i started using the radajaxmanager in the master page.
          So, if i have valid extensions. it uploads the file. BUT if the file extension is not valid; it does not show the error message text on the radupload popup instead it just vanished but never uploads the file. Now, i still need to show validation to the user although action wise its working fine.
            how can i apply the vaoidation. what chnages need to be done to the "validateRadUpload" function ?

    I am looking forward to you. Thanks,

    Regards,

    Osman
  6. Genady Sergeev
    Admin
    Genady Sergeev avatar
    1596 posts

    Posted 24 Sep 2010 Link to this post

    Hello Osmon,

    We have already answered to you in the support thread. Could you please take a look there?

    Best wishes,
    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
UI for ASP.NET Ajax is Ready for VS 2017