+1-888-365-2779
Try Now
More in this section

Forums / Sitefinity SDK / Upload image using RadUpload

Upload image using RadUpload

8 posts, 0 answered
  1. Bryan
    Bryan avatar
    62 posts
    Registered:
    20 Jul 2010
    04 Nov 2010
    Link to this post
    I am attempting to upload an image in a custom backend tool using the RadUpload control.  The form is submitting just fine but the upload control has no images.  Here is my event handler code:
    protected void InsertButton_Click(object sender, EventArgs e)
    {
        try
        {
            RadUpload upload = this.GetControl<RadUpload>("NewEmployeeImage");
            upload.AllowedFileExtensions = new string[] { ".jpg", ".png", ".jpeg", ".gif" };
            if (upload.UploadedFiles.Count < 1)
            {
                this.Message.ShowNegativeMessage("Please select a file to upload");
                return;
            }
            if (upload.InvalidFiles.Count > 0)
            {
                this.Message.ShowNegativeMessage("Allowed file types are " + String.Join(", ", upload.AllowedFileExtensions));
                return;
            }
            IDictionary<string, string> data = new Dictionary<string, string>();
            data.Add("FirstName", this.GetControl<TextBox>("txtCreateFirstName").Text);
            data.Add("LastName", this.GetControl<TextBox>("txtCreateLastName").Text);
            data.Add("Position", this.GetControl<TextBox>("txtCreatePosition").Text);
            data.Add("Email", this.GetControl<TextBox>("txtCreateEmail").Text);
            data.Add("Info", this.GetControl<RadEditor>("reCreateBio").Content);
            ModelImage img = this.Module.CreateEmployee(data, upload.UploadedFiles[0]);
        }
        catch (Exception ex)
        {
            this.Message.ShowNegativeMessage(ex.Message);
            return;
        }
        this.Message.ShowPositiveMessage("Employee photo has been successfully created");
        this.RefreshData();
    }

    and the ASCX:
    <telerik:RadUpload ID="NewEmployeeImage" runat="server" AllowedFileExtensions=".jpg, .png, .jpeg, .gif" MaxFileInputsCount="1" Width="100%" InputSize="45" ControlObjectsVisibility="None" />

    This is pretty much just adapted from the JobsModule in the sdk examples.  All of the other values from the form come through just fine except the RadUpload control.

    Thanks for the help.
    Bryan


  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    05 Nov 2010
    Link to this post
    Hello Bryan,

    I am sending you a sample control that should work properly at your end


    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using Telerik.Sitefinity.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Web.UI;
     
    namespace CustomModule
    {
        class Class6 : SimpleView
        {
     
            protected override void InitializeControls(GenericContainer container)
            {
                Trigger.Click += new EventHandler(Trigger_Click);
            }
     
            void Trigger_Click(object sender, EventArgs e)
            {
     
                RadUpload upload = this.RadUploadControl;
                upload.AllowedFileExtensions = new string[] { ".jpg", ".png", ".jpeg", ".gif" };
                if (upload.UploadedFiles.Count < 1 || upload.InvalidFiles.Count > 0)
                {
                    Page.RegisterClientScriptBlock("NoI", "<script>alert('no file or invalid to upload');</script>");
                    return;
                }
                else
                {
                    var file = upload.UploadedFiles[0];
                    Page.RegisterClientScriptBlock("ok", "<script>alert('" + file.FileName + "');</script>");
                }       
           
            }
     
            protected override string LayoutTemplateName
            {
                get { return "RadUploadControl"; }
            }
     
            public override string LayoutTemplatePath
            {
                get
                {
                    return "~/Controls/RadUploadControl.ascx";
                }
                
            }
     
            protected virtual Button Trigger
            {
                get
                {
                    return this.Container.GetControl<Button>("InsertButton1", true);
                }
            }
     
            protected virtual RadUpload RadUploadControl
            {
                get
                {
                    return this.Container.GetControl<RadUpload>("NewEmployeeImage", true);
                }
            }
        }
    }

    template

    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="RadUploadControl.ascx.cs" Inherits="SitefinityWebApp.Controls.RadUploadControl" %>
     
     
     
    <telerik:RadUpload ID="NewEmployeeImage" runat="server" AllowedFileExtensions=".jpg, .png, .jpeg, .gif" MaxFileInputsCount="1" Width="100%"
    InputSize="45" ControlObjectsVisibility="None" />
     
    <asp:Button runat="server" ID="InsertButton1"  Text="Upload Your Image" />

    I attached a short video where you can see that the items collection is properly populated.

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. Bryan
    Bryan avatar
    62 posts
    Registered:
    20 Jul 2010
    05 Nov 2010
    Link to this post
    Hey Ivan,

    There is still no file content coming in the http post.  I noticed on the rendered HTML that the form doesn't have the enctype="multipart/form-data" attribute:

    Here's the form rendered inside Sitefinity:
    <form method="post" action="Employees" id="aspnetForm">

    Then when I create a quick, simple .NET form with a FileUpload control I get this:
    <form method="post" action="TestFileUpload.aspx" id="form1" enctype="multipart/form-data">

    Might this have something to do with it?  The form I'm trying to add to the Sitefinity back end doesn't use any ajax since I don't have time to spin up on it (I've been stuck in the .NET 1.1 world for the last 5 years).  Does Sitefinity require all posts use the ajax frameworks?

    Thanks for your help.
    Bryan
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    05 Nov 2010
    Link to this post
    Hello Bryan,

    The control that I am using inherits from SimpleView. Generally you can edit the backend page you have from Administration >> Backend pages and drop the control on a page. I checked this scenario an it also works fine.

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. Bryan
    Bryan avatar
    62 posts
    Registered:
    20 Jul 2010
    05 Nov 2010
    Link to this post
    OK, that's probably the difference.  Mine is created by a module.  My module loosely follows the JobsModule SDK example.  In the Install method of the module I create the group page and add my back end page then I add my EmployeesOverview control to that page using the Sitefinity API.  My EmployeesOverview also inherits SimpleView.

    I will code it up as a back end page and see what kind of results I get.  FWIW, here's the code I use to create the page in the module Install method:

    sf.Page().CreateNewStandardPage(this.LandingPageId, this.SubPageId).Do(p =>
    {
        p.Name = "Employee Photos";
        p.ShowInNavigation = false;
        p.Description = "Add and modify employee photos";
        p.Attributes["ModuleName"] = EmployeesModule.MODULE_NAME;
        p.Title = "Employee Photos";
        p.UrlName = "EmployeePhotos";
    }).CheckOut().Do(draft =>
        draft.TemplateId = sf.Page().PageManager.GetTemplates().Where(t =>
            t.Name == SiteInitializer.BackendTemplateName).SingleOrDefault().Id
        ).Control().CreateNew(new EmployeesOverview(), "Content")
            .Done()
            .Publish();
    restart = true;

    Thanks,
    Bryan
  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    08 Nov 2010
    Link to this post
    Hello Bryan,

    I checked this by adding the control programmatially on the page and it should with the code below


    Telerik.Sitefinity.Modules.Pages.PageManager pManager = new PageManager();
              Guid templateGuid = pManager.GetTemplates().First().Id;
              App.WorkWith()
              .Page()
              .CreateNewStandardPage(new Guid("597e0c2b-f1d3-4386-bb7f-714c640573b3"), new Guid("8F532FEE-58A2-427B-BF87-2C6AADC2BD7D")).Do(p =>
                  {
                      p.Name = "some name";
                      p.ShowInNavigation = true;
                      p.Description = "some desc";
                      p.Title = "some title";
                      p.Page.HtmlTitle = "some html title";
                      p.UrlName = "urlname";
                      p.Page.Title = "backend page title";
                  })               
              .CheckOut()
              .SetTemplateTo(templateGuid)               
                  .Control()
                  .CreateNew(new Class6(), "T063CD6ED000_Col00")
                  .Done()
              .Publish()
              .SaveChanges();




    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. Bryan
    Bryan avatar
    62 posts
    Registered:
    20 Jul 2010
    10 Nov 2010
    Link to this post
    Hey Ivan,

    I am still having no luck with this.  I reworked the code and turned it into a back end page with my control.  All data with the exception of the RadUpload UploadedFiles is coming through.  I have also tried using a plain old asp:FileUpload control and it doesn't work either.  I have noticed there is no enctype="multipart/form-data" attribute in the render asp.net form.  Might this be the cause?

    In trying different solutions to try to get this to work, I placed the control on a public page and it works while placing the control on a back end page does not. Any suggestions?

    Thanks,
    Bryan
  8. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    10 Nov 2010
    Link to this post
    Hello Bryan,

    I was not able to reproduce this issue at my end. Both on the front end page and backend page the control works fine. Actually there is not a big difference between backend and front page, because this is one SiteMap with two parent nodes. The RadEditor is a wrapper of FileUpload and the problem could be somewhere in the server you use or in the browser.

    Regards,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
8 posts, 0 answered