适用于Marketters的Web表单(WFFM)带有占位符属性的Html输入标记

Question

我有一个要求,我正在实施sitecore WFFM来创建一个表单.该页面包含带有Placeholder属性的HTML输入标记.我必须将WFFM SingleLineInput框渲染为具有占位符属性的输入标记.我该怎么办？

我知道这个SingleLineText类是在Sitecore.Form.Web.UI.Controlsdll中定义的.

Answer 1

如果您使用的是WFFM的MVC版本,则需要按照批准的答案中的说明添加以下内容

1-创建一个类

 public interface IPlaceholderField
{
    string PlaceHolder { get; set; }
}

[ValidationProperty("Text")]
public class SingleLineText : Sitecore.Form.Web.UI.Controls.SingleLineText, IPlaceholderField
{
    [VisualCategory("Custom Properties")]
    [VisualProperty("Placeholder", 2)]
    [DefaultValue("")]
    public string PlaceHolder { get; set; }

    protected override void OnInit(EventArgs e)
    {
        // Set placeholder text, if present
        if (!string.IsNullOrEmpty(PlaceHolder))
        {
            textbox.Attributes["placeholder"] = PlaceHolder;
        }

        base.OnInit(e);
    }
}



public class ExtendedSingleLineTextField : Sitecore.Forms.Mvc.ViewModels.Fields.SingleLineTextField, IPlaceholderField
{
    [VisualCategory("Custom Properties")]
    [VisualProperty("Placeholder", 2)]
    [DefaultValue("")]
    public string PlaceHolder { get; set; }

}

2-从/ sitecore/system/Modules/Web窗体中复制单行文本,用于营销人员/设置/字段类型/简单类型/单行文本到/ sitecore/system/Modules/Web表单,用于营销人员/设置/字段类型/自定义 组件,类和MVC类型

3 - 在\ Views\Form\EditorTemplates下创建一个新的chtml文件,名称为ExtendedSingleLineTextField.cshtml,它应该与类名相同(ExtendedSingleLineTextField)

@using Sitecore.Forms.Mvc.Html
@using LendLease.Web.HtmlHelpers
@model  LendLease.Extension.Sc.WFFM.ExtendedSingleLineTextField


@using (Html.BeginField())
{
    @*@Html.TextBoxFor(m => m.Value, new { placeholder = Model.PlaceHolder })*@
    @Html.ExtendedBootstrapEditor("value",Model.PlaceHolder,"",new []{""})

}

添加一个html帮助器,以便您可以注入占位符我将其命名为BootstrapEditorHtmlHelperExtension.cs

  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.Editor(expression, new
        {
            htmlAttributes = new
            {
                @class = (string.Join(" ", classes) + " form-control" + (string.IsNullOrEmpty(str) ? string.Empty : " " + str) + (helper.ViewData.Model is SingleLineTextField ? " dangerousSymbolsCheck" : string.Empty)),
                placeholder = placeholderText,
                style = (inlineStyle ?? string.Empty)
            }
        });
    }
}

Answer 2

您可以通过扩展SingleLineText一个附加属性来存储占位符的文本值来实现此目的。一旦该属性就位，您将需要重写该OnInit方法并注入占位符属性（如果恰好设置了）。

public interface IPlaceholderField
{
    string PlaceholderText { get; set; }
}

这是自定义实现SingleLineText

[ValidationProperty("Text")]
public class SingleLineText : Sitecore.Form.Web.UI.Controls.SingleLineText, IPlaceholderField
{
    [VisualCategory("Custom Properties")]
    [VisualProperty("Placeholder Text", 2)]
    [DefaultValue("")]
    public string PlaceholderText { get; set; }

    protected override void OnInit(EventArgs e)
    {
        // Set placeholder text, if present
        if (!String.IsNullOrEmpty(PlaceholderText))
        {
            textbox.Attributes["placeholder"] = PlaceholderText;
        }

        base.OnInit(e);
    }
}

最后，您需要在下面创建一个新的字段项定义/sitecore/system/Modules/Web Forms for Marketers/Settings/Field Types/Custom/，并将程序集设置为使用上面的类。当您在表单设计器中选择该字段时，您的新占位符属性应出现在“自定义属性”类别下。