Implementing custom designer for FormsControl
Hi
I've implemented a FormsControlCustom that inherits from FormsControl and overrides the submit method so that I can email the form details out. All works fine when I hard code the email settings, but I'm trying to implement a custom designer so that I can set the email recipients and subject per form instance. The problem is that the form is not saving the extra data, it is, however, saving the selected form.
The problem appears to be in the javascript. If I inherit from FormsControl and change the type in the registerClass method to FormsControlDesigner, it works as described above, if I inherit from ControlDesignerBase and change the type in the registerClass to match, it does not work at all - gives "e is undefined" error message and displays a blank form.
Type.registerNamespace("Autonet.FormFill");Autonet.FormFill.FormsControlCustomDesigner = function (element) Autonet.FormFill.FormsControlCustomDesigner.initializeBase(this, [element]); this._parentDesigner = null; this._toogleGroupSettingsDelegate = null;Autonet.FormFill.FormsControlCustomDesigner.prototype = initialize: function () Autonet.FormFill.FormsControlCustomDesigner.callBaseMethod(this, 'initialize'); this._toogleGroupSettingsDelegate = Function.createDelegate(this, function () dialogBase.resizeToContent(); ); jQuery(".sfExpandableSection a").click(this._toogleGroupSettingsDelegate).click(function() $(this).parents(".sfExpandableSection:first").toggleClass("sfExpandedSection"); ); , dispose: function () Autonet.FormFill.FormsControlCustomDesigner.callBaseMethod(this, 'dispose'); , refreshUI: function () var data = this.get_controlData(); jQuery("#EmailRecipients").val(data.EmailRecipients); jQuery("#EmailCc").val(data.EmailCc); jQuery("#EmailSubject").val(data.EmailSubject); , applyChanges: function () var controlData = this.get_controlData(); controlData.EmailRecipients = jQuery("#EmailRecipients").val(); controlData.EmailCc = jQuery("#EmailCc").val(); controlData.EmailSubject = jQuery("#EmailSubject").val(); , get_controlData: function () return this.get_propertyEditor().get_control(); , // gets the reference to the propertyEditor control get_propertyEditor: function () return this._propertyEditor; , // sets the reference fo the propertyEditor control set_propertyEditor: function (value) this._propertyEditor = value; ,Autonet.FormFill.FormsControlCustomDesigner.registerClass('Autonet.FormFill.FormsControlCustomDesigner', Telerik.Sitefinity.Modules.Forms.Web.UI.Designers.FormsControlDesigner);if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();When saving the selected form, it is posting to "~/Sitefinity/Services/Pages/ControlPropertyService.svc" where I would expect it to be posting to "~/Sitefinity/Services/Forms/FormsService.svc" as in the template declaration. Is this where the problem is, and how would I solve it?
Part of my problem appears to be attached delegates to the form selected event of the ContentSelector. How do I go about that? I've tried using pageSelected, formSelected, contentSelected, but none of them seem to work.
Thanks
Hi Ryan,
ControlPropertyService is called when the designer saves the data you passed. FormsService is used to populate the data.
Type.registerNamespace("Telerik.Sitefinity.Samples");Telerik.Sitefinity.Samples.FormsControlDesignerCustom = function (element) this._contentSelector = null; this._MailSettings = null; Telerik.Sitefinity.Samples.FormsControlDesignerCustom.initializeBase(this, [element]);Telerik.Sitefinity.Samples.FormsControlDesignerCustom.prototype = initialize: function () Telerik.Sitefinity.Samples.FormsControlDesignerCustom.callBaseMethod(this, 'initialize'); , dispose: function () Telerik.Sitefinity.Samples.FormsControlDesignerCustom.callBaseMethod(this, 'dispose'); , reset: function () this.set_value(null); Telerik.Sitefinity.Samples.FormsControlDesignerCustom.callBaseMethod(this, "reset"); , refreshUI: function () var controlData = this.get_controlData(); if (!controlData) return; , // once the data has been modified, call this method to apply all the changes made // by this designer on the underlying control object. applyChanges: function () this.get_controlData().email = this.get_MailSettings().Text; , get_contentSelector: function () return this._contentSelector; , set_contentSelector: function (value) this._contentSelector = value; , get_MailSettings: function () return this._MailSettings; , set_MailSettings: function (value) this._MailSettings = value; Telerik.Sitefinity.Samples.FormsControlDesignerCustom.registerClass('Telerik.Sitefinity.Samples.FormsControlDesignerCustom', Telerik.Sitefinity.Modules.Forms.Web.UI.Designers.FormsControlDesigner);