Post 聚合铁表单-禁用提交？

我正在使用

iron表单

，并试图

将文件发布到（当前为本地）服务器。我有两个按钮，一个用于发送文件，另一个用于取消。我在取消时遇到问题。以下是表格：

<form  is="iron-form" action="http://localhost:7733/receivedoc" id="restForm" method="post" >
  <table class="starter-inputs">
    <tr><td>
    <px-file-upload 
      id="uploadComponentId"
      message="Drag and drop files here, or click the button below." 
      multiple=false 
      accept=".xls,.xlsx">
    </px-file-upload>
    </td></tr>
    </table>
    <button class="btn btn--large btn--icon" id="saveDataSetButton">
      <i class="fa-briefcase">Generate Pacing File</i>
    </button>
    <button class="btn btn--large btn--icon" id="cancelDataSetButton">
      <i class="fa-briefcase">Cancel</i>
    </button>
    <div class="output"></div>
  </form>

但是，因为，不管怎样，
POST
都会被触发。如何防止“取消”按钮弹出？
这是一个好问题

我想在这里强调几件事

首先，让我们刷新一些有关HTML规范的基础知识：

1） 
没有属性
type
将作为默认属性
type=submit
，这就是为什么两个按钮都将提交表单

2） 
支持
type=“reset”
，它会将所有字段重置为初始值（例如清除它们），并且不会提交表单，因此根本不需要JS处理程序代码

总之，我建议您对HTML代码进行一些调整，与按钮块相关：

<button type="submit" class="btn btn--large btn--icon" id="saveDataSetButton">
    <i class="fa-briefcase">Generate Pacing File</i>
</button>
<button type="reset" class="btn btn--large btn--icon" id="cancelDataSetButton">
    <i class="fa-briefcase">Cancel</i>
</button>


生成起搏文件
取消

请注意，对于
cancelDataSetButton
不需要JS代码（清除字段），您可以删除整个事件侦听器：

this.$.cancelDataSetButton.addEventListener（'click'，function（）{
还有一个

一些需要补充的参考资料：

<button type="submit" class="btn btn--large btn--icon" id="saveDataSetButton">
    <i class="fa-briefcase">Generate Pacing File</i>
</button>
<button type="reset" class="btn btn--large btn--icon" id="cancelDataSetButton">
    <i class="fa-briefcase">Cancel</i>
</button>