Question

在我的一个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和Crated a .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中创建了一个自定义字段并给了下面的dll参考。在

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

Answer 1

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

/ sitecore / templates /营销人员/字段类型的网络表单

如果您正在使用WFFM和MVC，则需要填写MVC Type字段。

你可以看看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/

如何在Marketer 8.1的Sitecore Web窗体中创建自定义字段类型

1 个答案: