Clarity 选项卡溢出按钮提交表单
Clarity tab overflow button submits form
我有一个包含选项卡的表单,其中一些选项卡溢出。单击溢出按钮以显示隐藏的选项卡时,它会提交表单。查看 DOM,我可以看到溢出按钮没有指定类型 ="button",因此它会提交。建议?
简化示例:
<form [formGroup]="myForm" (ngSubmit)="onSubmit()">
<button type="button" clrTabLink (click)="tabClicked($event)">General</button>
<ng-template [(clrIfActive)]="generalTabActive">
<clr-tab-content id="content1" *clrIfActive>
<div>Tab content here</div>
</clr-tab-content>
</ng-template>
<clr-tab>
<button type="button" clrTabLink [clrTabLinkInOverflow]="inOverflow" (click)="tabClicked($event)">Overflow Tab Here</button>
<clr-tab-content *clrIfActive>
<div>Overflow tab content here</div>
</clr-tab-content>
</clr-tab>
</form>
这是我们这边的一个错误,我刚刚在这里报告了它:https://github.com/vmware/clarity/issues/2214
这是一个非常简单的修复,应该很快。
感谢您提出这个问题。 :-)
编辑:感谢 Aditya 的反应,它已于今天早上修复,并将在今天的版本中发布。因此,您需要做的就是移至 Clarity 0.11.15,此切换将停止提交表单。
我有一个包含选项卡的表单,其中一些选项卡溢出。单击溢出按钮以显示隐藏的选项卡时,它会提交表单。查看 DOM,我可以看到溢出按钮没有指定类型 ="button",因此它会提交。建议?
简化示例:
<form [formGroup]="myForm" (ngSubmit)="onSubmit()">
<button type="button" clrTabLink (click)="tabClicked($event)">General</button>
<ng-template [(clrIfActive)]="generalTabActive">
<clr-tab-content id="content1" *clrIfActive>
<div>Tab content here</div>
</clr-tab-content>
</ng-template>
<clr-tab>
<button type="button" clrTabLink [clrTabLinkInOverflow]="inOverflow" (click)="tabClicked($event)">Overflow Tab Here</button>
<clr-tab-content *clrIfActive>
<div>Overflow tab content here</div>
</clr-tab-content>
</clr-tab>
</form>
这是我们这边的一个错误,我刚刚在这里报告了它:https://github.com/vmware/clarity/issues/2214 这是一个非常简单的修复,应该很快。
感谢您提出这个问题。 :-)
编辑:感谢 Aditya 的反应,它已于今天早上修复,并将在今天的版本中发布。因此,您需要做的就是移至 Clarity 0.11.15,此切换将停止提交表单。