Topic: MDB5 Datepicker toggle submits form
When i press on the datepicker toggle the form submits and ngSubmit fires. I dont know if thats a bug or i used it wrong. Please help. I use (1.0.0-beta7 (28.06.2021)) but i cant select it
here is the component code:
<div class="container-fluid mt-5" style="width: 90%;">
<form [formGroup]="form" (ngSubmit)="create_profile()">
<div class="row">
<div class="col-6">
<div class="card text-center">
<div class="card-header">Stammdaten</div>
<div class="card-body">
<table class="table table-sm"><tbody>
<tr>
<td class="pe-3 text-start align-middle">Geburtstag</td>
<td>
<mdb-form-control>
<input mdbInput [mdbDatepicker]="datepicker" type="text" class="form-control" id="exampleDatepicker" formControlName="birthday" />
<mdb-datepicker-toggle [mdbDatepicker]="datepicker"></mdb-datepicker-toggle>
<mdb-datepicker #datepicker [options]="translationOptions" [format]="'dd.mm.yyyy'"></mdb-datepicker>
</mdb-form-control>
</td>
</tr>
</tbody>
</table>
<button type="submit" [disabled]="!form.valid" class="btn btn-primary float-end">Speichern</button>
</div>
</div>
</div>
</div>
</form>
Arkadiusz Idzikowski staff answered 3 years ago
It is a bug that we need to fix on our end. As a workaround for now, please try to prevent default action on click event:
<mdb-datepicker-toggle [mdbDatepicker]="datepicker" (click)="$event.preventDefault()"></mdb-datepicker-toggle>
Dave Moniz premium priority answered 3 years ago
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: MDB5 1.0.0-beta5
- Device: MacBook Pro
- Browser: Chrome
- OS: MacOS
- Provided sample code: No
- Provided link: No