提交后重置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>

- Krang

Answer 1

Marketo的表单对象并没有重置功能，但幸运的是，javascript有一个本地的.reset()方法可以在HTML表单元素上使用。这个.reset()方法将恢复表单元素的默认值。

话虽如此，在.onSuccess()回调中所要做的只是获取HTML表单。调用Marketo表单对象的.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）将保持不变。

- dferenc