angular - 触发单击 Angular 2/4 表单中的表单提交按钮导致边缘浏览器出现问题

问题描述

我有一个场景，我需要通过代码调用我的表单提交，因为我的提交按钮是隐藏的。我有一个使用以下逻辑调用按钮单击（所有表单的一个通用按钮）的逻辑。

const element = 
  this._elementRef.nativeElement.getElementsByClassName('personal-btn');
if (element && element[0]) {
  element[0].click();
}

我的表格：

<json-schema-form [widgets]="customWidgets" 
  [framework]="selectedFrameWork" 
  [form]="jsonFormObject" 
  [options]="jsonFormOptions" 
  (onChanges)="onChanges($event)" (valueChanges)="changeInputValue($event)"
  (onSubmit)="saveInfo($event)" 
  (valueChanges)="changeInputValue($event)">
</json-schema-form>

我的表格提交：

<div class="d-none">
  <input aria-describedby="control52Status" class="personal-btn btn btn- 
    primary float-right" id="control52"
    name="undefined" type="submit" value="undefined">
</div>

我面临的问题是，当我单击下一个按钮（通过代码调用表单提交逻辑）时，表单提交发生并且表单输入值被附加到当前 URL，而不是发生内部逻辑和页面刷新.

例子：

[site url]?name=test123

但是，当我删除提交按钮上的隐藏属性并最终单击该提交按钮时，表单会正确提交，而无需附加 URL 和页面刷新。

我在边缘以外的任何浏览器中都没有遇到这个问题。

我的问题与此相同：停止“？” 从被添加到 URL

但是 preventDefault 或 return false 解决方案都没有帮助我。

标签： angularmicrosoft-edgeangular-formsangular-schema-form

angular - 触发单击 Angular 2/4 表单中的表单提交按钮导致边缘浏览器出现问题

问题描述

解决方案

推荐阅读