Form Builder: Create a custom control for file upload
Hi,
I need to add a fileupload to a form, but I am struggling with how to
create a control for form builder. The value (filename) is not saved into the database after I submit a
form. Can anyone point out what I did wrong? Thanks a lot.
Stephen
FileUploader.ascx
<%@ Control Language="C#" %>
<
asp:Label
runat
=
"server"
ID
=
"titleLabel"
CssClass
=
"sfTxtLbl"
Text
=
"title label"
></
asp:Label
>
<
asp:FileUpload
ID
=
"FileUpload1"
runat
=
"server"
/><
br
/>
<
asp:Label
runat
=
"server"
ID
=
"exampleLabel"
CssClass
=
"sfExample"
Text
=
"example Label"
></
asp:Label
><
br
/>
<
asp:Label
runat
=
"server"
ID
=
"descriptionLabel"
CssClass
=
"sfExample"
Text
=
"description Label"
></
asp:Label
>
// ----------------------------------------------------------------------------------------------------------
// <
copyright
file
=
"FileUploader.cs"
company
=
"Telerik"
>
// Authored by Falafel Software.
// </
copyright
>
// ----------------------------------------------------------------------------------------------------------
namespace CustomFormControls
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Sitefinity.Data.Metadata;
using Telerik.Sitefinity.Metadata.Model;
using Telerik.Sitefinity.Model;
using Telerik.Sitefinity.Modules.Forms;
using Telerik.Sitefinity.Modules.Forms.Web.UI.Fields;
using Telerik.Sitefinity.Security;
using Telerik.Sitefinity.Web.UI;
using Telerik.Sitefinity.Web.UI.Fields;
using Telerik.Sitefinity.Web.UI.Fields.Config;
using Telerik.Sitefinity.Web.UI.Fields.Enums;
using Telerik.Web.UI;
/// <
summary
>
/// Class used to create custom control for Form Builder
/// </
summary
>
[DatabaseMapping(UserFriendlyDataType.ShortText)]
public class FileUploader : FieldControl, IFormFieldControl
#region Fields
/// <
summary
>
/// Private field for metaField
/// </
summary
>
private IMetaField metaField = null;
#endregion
#region Constructor
/// <
summary
>
/// Initializes a new instance of the FileUploader class.
/// </
summary
>
public FileUploader()
#endregion
#region Public properties (will show up in dialog)
/// <
summary
>
/// Example string
/// </
summary
>
public override string Example get; set;
/// <
summary
>
/// Title string
/// </
summary
>
public override string Title get; set;
/// <
summary
>
/// Description string
/// </
summary
>
public override string Description get; set;
#endregion
#region IFormFieldControl members
/// <
summary
>
/// Gets or sets MetaField property to persist data from control to the DB when form is submitted
/// </
summary
>
[TypeConverter(typeof(ExpandableObjectConverter))]
public IMetaField MetaField
get
if (this.metaField == null)
this.metaField = this.LoadDefaultMetaField();
// Add unique field name
this.metaField.FieldName = "FileUploader_" + this.ClientID;
return this.metaField;
set
this.metaField = value;
#endregion
#region Value method
/// <
summary
>
/// Get and set the value of the field.
/// </
summary
>
public override object Value
get
return this.FileUpload1.FileName;
set
//this.TextBox1.Text = value.ToString();
#endregion
#region Labels on control template
/// <
summary
>
/// Gets reference to the TitleLabel
/// </
summary
>
protected internal virtual Label TitleLabel
get
return this.Container.GetControl<
Label
>("titleLabel", true);
/// <
summary
>
/// Gets reference to the DescriptionLabel
/// </
summary
>
protected internal virtual Label DescriptionLabel
get
return Container.GetControl<
Label
>("descriptionLabel", true);
/// <
summary
>
/// Gets reference to the ExampleLabel
/// </
summary
>
protected internal virtual Label ExampleLabel
get
return this.Container.GetControl<
Label
>("exampleLabel", this.DisplayMode == FieldDisplayMode.Write);
#region Template
/// <
summary
>
/// Specify a template for the control
/// </
summary
>
protected override string LayoutTemplateName
get return "CustomFormControls.Resources.FileUploader.ascx";
#endregion
/// <
summary
>
/// Reference to the TitleControl
/// </
summary
>
protected override WebControl TitleControl
get
return this.TitleLabel;
/// <
summary
>
/// Reference to the DescriptionControl
/// </
summary
>
protected override WebControl DescriptionControl
get
return this.DescriptionLabel;
/// <
summary
>
/// Gets the reference to the control that represents the example of the field control.
/// Return null if no such control exists in the template.
/// </
summary
>
/// <
value
></
value
>
protected override WebControl ExampleControl
get
return this.ExampleLabel;
#endregion
#region Textbox on control
/// <
summary
>
/// Gets reference to the FileUpload1 control
/// </
summary
>
protected virtual FileUpload FileUpload1
get
return this.Container.GetControl<
FileUpload
>("FileUpload1", true);
#endregion
#region Script methods
/// <
summary
>
/// Get list of all scripts used by control
/// </
summary
>
/// <
returns
>List of all scripts used by control</
returns
>
public override IEnumerable<
ScriptDescriptor
> GetScriptDescriptors()
var descriptor = new ScriptControlDescriptor(this.GetType().FullName, this.ClientID);
descriptor.AddComponentProperty("fileUpload", this.FileUpload1.ClientID);
descriptor.AddProperty("displayMode", this.DisplayMode); // Pass the display mode value
// Pass the field name - this is VERY IMPORTANT - if this value isn't passed the backend publishing will not work
descriptor.AddProperty("dataFieldName", this.MetaField.FieldName);
return new[] descriptor ;
/// <
summary
>
/// Get reference to all scripts
/// </
summary
>
/// <
returns
>Reference to all scripts</
returns
>
public override IEnumerable<
System.Web.UI.ScriptReference
> GetScriptReferences()
var scripts = new List<
ScriptReference
>(base.GetScriptReferences())
new ScriptReference("CustomFormControls.Resources.CustomFormControls.js", this.GetType().Assembly.FullName),
new ScriptReference("Telerik.Sitefinity.Web.UI.Fields.Scripts.FieldDisplayMode.js", "Telerik.Sitefinity"),
;
return scripts;
#endregion
#region InitializeControls method
/// <
summary
>
/// You have to implement the custom logic you want to have inside IntializeControls()
/// </
summary
>
/// <
param
name
=
"container"
>Style cop won't shut up</
param
>
protected override void InitializeControls(GenericContainer container)
// Set the label values
this.ExampleLabel.Text = this.Example;
this.TitleLabel.Text = this.Title;
this.DescriptionLabel.Text = this.Description;
//this.FileUpload1.FileName = GetCurrentSitefinityUser();
#endregion
#region Get Current User
/// <
summary
>
/// Get the full name for the currently logged-in Sitefinity user.
/// </
summary
>
/// <
returns
>String with full name of current user, or empty string if user not logged in.</
returns
>
private static string GetCurrentSitefinityUser()
Telerik.Sitefinity.Security.Web.UI.ProfileView pv = new Telerik.Sitefinity.Security.Web.UI.ProfileView();
Guid currentUserGuid = pv.CurrentUser.UserId;
if (currentUserGuid != Guid.Empty)
var userManager = UserManager.GetManager("Default");
var user = userManager.GetUser(currentUserGuid);
return user.FirstName + " " + user.LastName;
else
return String.Empty;
#endregion
Type.registerNamespace("CustomFormControls");
CustomFormControls.FileUploader = function (element)
this._fileUpload = null;
CustomFormControls.FileUploader.initializeBase(this, [element]);
CustomFormControls.FileUploader.prototype =
/* --------------------------------- set up and tear down --------------------------------- */
/* --------------------------------- public methods ---------------------------------- */
// Gets the value of the field control.
get_value: function ()
return this._fileUpload.get_value();
,
// Sets the value of the text field control depending on DisplayMode.
set_value: function (value)
this._fileUpload.set_value(value);
,
/* --------------------------------- event handlers ---------------------------------- */
/* --------------------------------- private methods --------------------------------- */
/* --------------------------------- properties -------------------------------------- */
get_fileUpload: function ()
return this._fileUpload;
,
set_fileUpload: function (value)
this._fileUpload = value;
CustomFormControls.FileUploader.registerClass('CustomFormControls.FileUploader', Telerik.Sitefinity.Web.UI.Fields.FieldControl);
Hi Stephen,
As I've already said in your support ticket, this feature would come out of the box very soon in Sitefinity but currently it is not possible to upload files on form submission.
Greetings,Hi Svetoslav
We too need an form control to upload a document. Any update on this would be great.
Hi guys,
This feature, together with some other small ones, has been rescheduled for the next release (after 5.0), as the time frame turned out to be too small for them to be finished. You should be able to see this in one or two releases time.
Kind regards,Any news on this yet?
I am currently building a site on the latest SF (5.0.2500.0) and this functionality appears to not be present.
Which release after the 5.0 will this be included in?..Or have I missed something? This is a pretty essential control and to be honest writing my own is a bit of a pain.
Thanks
Any news on this yet?
I am currently building a site on the latest SF (5.0.2500.0) and this functionality appears to not be present.
Which release after the 5.0 will this be included in?..Or have I missed something? This is a pretty essential control and to be honest writing my own is a bit of a pain.
Thanks
Vote on it guys, PLEASE :) Forms updates keep getting bumped.
Link to vote: http://www.telerik.com/support/pits.aspx#/public/sitefinity/11083
Is this "out-of-the-box" file upload available in any of the 5.X versions?
Hi Sitefinity Team,
This was a very good question, in fact someone only looking for direction in working out how to solve a problem, met with a very abrupt response.
Having had this need myself today, it would not only seem that Svetoslav was somewhat in accurate in his advice that this was coming out in the next version but in fact even today this is listed on PITS as not scheduled.
This is no brainer stuff. It is not uncommon for people to need to upload a file when filling in a form. Please pay attention to some of this sort of basic stuff in addition to pushing forward with the new features.
This even exists in module builder. I can create my own module and upload files easily!
Today this sits directly adjacent to an advert for V 5.2 release with the headline "Staying afloat while managing multiple websites and personalisation"
Maybe a headline to send back to Sitefinity would be "Staying afloat whilst trying to do the basics"
@Steve, good idea to put the link in to get some votes. Voted!
Darren
We have created a FormField that is an ASP file uploader... It's quite hacked together, but works... We've even continued the hacking so that the form response emailer we've created will add the file selected as an attachment.
If anyone is stuck on their code, just ask where and I'll try and help.
When this is Out of the Box functionality, that will be great.
@Stephen2 do you have any code samples you can share?