Question

我正在使用Sitecore 7.2和Web Forms for Marketers 2.4。使用wffm表单设计器我创建了一个包含droplist的表单。我希望能够根据下拉列表的选定值隐藏或取消隐藏相同表单中的其他字段。通过我的研究，我想出了导出表单（通过表单设计器导出）并将子布局指向导出的表单。然后我将onChange事件添加到了droplist。

<cc3:droplist runat="server" title="Country" emptychoice="True" id="field_xyz" cssclass="scfDropListBorder fieldid.%7bxyz%7d name.Country" controlname="Country" fieldid="{xyz}" enableviewstate="False" onchange="checkField()">

然后我在页面底部添加了一个javascript。

function checkField() {
  alert("Hello! I am an alert box!!");
  var a = document.getElementById("field_xyz");
  alert(a.options[a.selectedIndex].value);
  var cityTextBox = document.getElementById("field_abc").parentNode.parentNode;
  if (a == "United States") {
    cityTextBox.style.display = "block";
  } else {
    cityTextBox.style.display = "none";
  }
  alert("Ending Script");
}

我可以得到'你好！'警报每次显示但不显示“结束”警报，并且“a”的值始终为空。

我在Sitecore中尝试做什么？

我读了一些其他内容，说因为封装和保护级别而导致问题。我还可以确认，当我提交表格时，它确实出现在WFFM报告中，所以我知道它正在提交。

任何帮助/建议/指示都将不胜感激。

Answer 1

我从未使用过导出功能，因此无法评论其有效性或易用性。我的建议是简单地使用前端的自定义css类和jquery来隐藏/显示，具体取决于所选的值。

在/sitecore/system/Modules/Web Forms for Marketers/Settings/Meta data/Css Classes下创建2个新的css类。称他们为“隐藏依赖”和“依赖领域”
添加您的字段，然后在国家/地区字段中选择“隐藏依赖”作为CSS类，为城市选择“dependent-field”
将以下Javascript添加到您自己的网站js文件中。

代码将绑定处理程序以触发onchange，检查所选值，然后使用dependent-field类隐藏/显示所有字段。指定链式field-border可确保我们隐藏整行，而不仅仅是选择框。

(function ($) {
    var HideDependentFied = function (value) {
        var condition = (value == "USA");
        $(".dependent-field.field-border").toggle(condition);
    };

    $(document).ready(function() {
        var $field = $(".hide-dependent.field-border select");
        $field.on("change", function() {
            HideDependentFied(this.value)
        });
        HideDependentFied($field.val());
    });
})($scw);

上面的代码使用的是Immediately Invoked Function Expression，传递的是$ scw，这是WFFM使用的jQuery变量。

您可能还希望在文档准备就绪时触发该功能，以确保该字段在加载时隐藏，并且仅在选择了适当的值时显示。

是否可以在Javascript中访问Sitecore WFFM控件的DropList值？

1 个答案: