sitecore之如何在 Sitecore Web Form for Marketer 8.1 中创建自定义字段类型

在我的一个 Sitecore 项目中，我必须在 WFFM 中创建一个自定义字段。 字段类型必须有两个文本框，用户可以在每个文本框中输入 5 位数字(例如 xxxxx xxxxx，因为我们在 4 个文本框中输入信用卡详细信息)。

根据引用文档“https://sdn.sitecore.net/upload/sitecore6/64/presentation_component_cookbook-a4.pdf ” 我已将以下代码打包:-

创建一个 .cs 类

using System; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using Sitecore.Form.Web.UI.Controls; 
using System.ComponentModel; 
using System.ComponentModel.Design; 
 
namespace Web.MySite.Fields 
{ 
    [Designer("System.Windows.Forms.Design.ParentControlDesigner, System.Design", typeof(IDesigner))] 
    public class SocialSecurityNumber : SingleLineText 
    { 
 
        private static readonly string baseCssClassName = "scfSingleLineTextBorder"; 
 
        protected TextBox firstPart;protected TextBox lastPart; 
 
        public SocialSecurityNumber() : this(HtmlTextWriterTag.Div) 
        { 
            firstPart = new TextBox(); 
            lastPart = new TextBox(); 
        } 
 
        public SocialSecurityNumber(HtmlTextWriterTag tag) : base(tag) 
 
        { 
            this.CssClass = baseCssClassName; 
        } 
 
        protected override void OnInit(EventArgs e) 
        { 
            SetCssClasses(); 
            SetTextBoxeWidths(); 
            SetMaxLengths(); 
            SetTextBoxModes(); 
            AddChildControls(); 
 
            base.OnInit(e); 
        } 
 
        private void SetCssClasses() 
        { 
            help.CssClass = "scfSingleLineTextUsefulInfo"; 
            title.CssClass = "scfSingleLineTextLabel"; 
            generalPanel.CssClass = "scfSingleLineGeneralPanel"; 
        } 
 
        private void SetTextBoxeWidths() 
        { 
            firstPart.Style.Add("width", "40px"); 
 
            lastPart.Style.Add("width", "50px"); 
        } 
 
        private void SetMaxLengths() 
        { 
            firstPart.MaxLength = 3; 
 
            lastPart.MaxLength = 4; 
        } 
 
        private void SetTextBoxModes() 
        { 
            firstPart.TextMode = TextBoxMode.SingleLine; 
 
            lastPart.TextMode = TextBoxMode.SingleLine; 
        } 
 
        private void AddChildControls() 
        { 
            Controls.AddAt(0, generalPanel); 
            Controls.AddAt(0, title); 
 
            generalPanel.Controls.Add(firstPart); 
 
 
            generalPanel.Controls.Add(lastPart); 
            generalPanel.Controls.Add(help); 
        } 
 
 
    } 
 
    public class SocialSecurityNumberModel : Sitecore.Forms.Mvc.ViewModels.Fields.SingleLineTextField 
    { 
 
 
    } 
 
 
} 

然后我创建了一个 BootstrapEditorHtmlHelperExtension.CS 并创建了一个 .CSHTML:-

using Sitecore.Forms.Mvc.Interfaces; 
using Sitecore.Forms.Mvc.ViewModels.Fields; 
using System.Web.Mvc; 
using System.Web.Mvc.Html; 
 
namespace Web.MySite.Extensions 
{ 
    public static class BootstrapEditorHtmlHelperExtension 
    { 
        public static MvcHtmlString ExtendedBootstrapEditor(this HtmlHelper helper, string expression, string placeholderText, string inlineStyle, string[] classes) 
        { 
            var str = string.Empty; 
            var viewModel = helper.ViewData.Model as IViewModel; 
            if (viewModel != null) 
            { 
                var styleSettings = viewModel as IStyleSettings; 
                if (styleSettings != null) 
                { 
                    str = styleSettings.CssClass; 
                } 
                if (string.IsNullOrEmpty(placeholderText)) 
                { 
                    placeholderText = viewModel.Title; 
                } 
            } 
 
            return helper.TextBox(expression,null, new 
            { 
 
                    @class = (string.Join(" ", classes) + " form-control col-lg-2" + (string.IsNullOrEmpty(str) ? string.Empty : " " + str) + (helper.ViewData.Model is SingleLineTextField ? " dangerousSymbolsCheck" : string.Empty)), 
                    placeholder = placeholderText, 
                    style = (inlineStyle ?? string.Empty) 
 
            }); 
        } 
 
 
 
    } 
 
 
 
} 

SocialSecurityNumberModel.CSHTML

@using Sitecore.Forms.Mvc.Html 
@using Web.MySite.Extensions 
 
@model  Web.MySite.Fields.SocialSecurityNumberModel 
 
@using (Html.BeginField()) 
{ 
 @Html.ExtendedBootstrapEditor("value", " ", "width:50%", new[] { "" })  
 @Html.ExtendedBootstrapEditor("value", " ", "width:40%", new[] { "" })  
 
} 

之后，我在 Sitecore 中创建了一个自定义字段并给出了 Below dll ref。在

Assembly  
Sitecore.Forms.Custom.dll 
 
Class 
Sitecore.Form.Web.UI.Controls.SingleLineText 
 
MVC Type  
Web.MySite.Fields.SocialSecurityNumberModel,Web.MySite 

我得到了两个文本框，但两者的 ID 相同。

ID=wffm1755f6ce241245b7a1183288954ce0e7_Sections_0__Fields_0__value 

请您参考如下方法:

您不必创建 ASCX 文件来为 WFFM 创建自定义字段 首先，您需要创建一个类型的项目:

/sitecore/templates/Web Forms for Marketers/Field Type

如果您将 WFFM 与 MVC 结合使用，则需要填写 MVC 类型字段。

您可以使用 Dot Peek 查看其他 Sitecore Wffm 字段是如何构建的。

你需要像这个例子一样创建你自己的类:

https://sitecorecorner.com/tag/wffm-custom-field/

http://elenazlateva.blogspot.ro/2012/09/custom-field-type-for-sitecore-web.html

https://divamatrix.wordpress.com/2011/12/20/wffm-custom-field-type-made-easy/