forms - 提交后重置 Marketo 表格

Question

我在我的网站上使用了一个嵌入式 Marketo 表单。

当我点击提交时，我希望表单重置为原始状态。

为此，我需要在我的代码中添加什么，更好的是我可以在 Marketo 文档中的何处找到它？

这是我当前的代码

<script src="//app-sjg.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm"></form>
<script>
  MktoForms2.loadForm("//app-sjg.marketo.com", "819-OWT-537", 1404);
</script>
<script>
  MktoForms2.whenReady(function (form){
    form.onSuccess(function(values, followUpUrl){
      $('#confirmform').modal('show');
      return false;
    });
  });
</script>

Answer 1

市场Form object没有重置功能，但幸运的是，javascript有这样一个原生.reset() HTML 表单元素上的方法。此 .reset() 方法将恢复表单元素的默认值。

话虽如此，在 .onSuccess() 回调中唯一要做的就是获取 HTML 表单。调用 Marketo Form 对象的 .getFormElem() 方法，将为我们提供 jQuery 包装的表单元素，因此使用 form.getFormElem()[0] 最后我们得到表单节点，我们可以在其上调用 .reset()。

示例代码如下:

<script src="//app-lon06.marketo.com/js/forms2/js/forms2.min.js"></script>
<form id="mktoForm"></form>
<script>
// The fourth argument of the `.loadForm()` can be used as an onReady callback.
MktoForms2.loadForm("//app-sjg.marketo.com", "819-OWT-537", 1404, function(form) {
    form.onSuccess(function(values, followUpUrl){
        // $('#confirmform').modal('show');
        console.log(form);
        // .getFormElem() returns the jQuery wrapped form element
        var formElement = form.getFormElem()[0];
        // .reset() is a native javascript method.
        formElement.reset();

        // If boolean `false` is returned then the visitor 
        // will NOT be forwarded to the follow up page!
        return false;
    });
});
</script>

注意:好消息是，所有重要的隐藏字段(例如:formid 和 munchkinId)都将保持不变。