Form control invalid with ngbDatePicker

Asked Dec 13 '19 at 16:58

Active Dec 13 '19 at 19:17

Viewed 248 times

I have the following input and works normally to save

<input id="field_dataAtivacao" type="text" class="form-control" name="dataAtivacao"
               ngbDatepicker #dataAtivacaoDp="ngbDatepicker" formControlName="dataAtivacao"
               [value]="dataAtivacao | date:'dd/MM/yyyy'" placeholder="00/00/0000"
               [disabled]="false" [readonly]="true" />

Form control

  editForm = this.fb.group({
        dataAtivacao: [],
    });

The value that comes from cliente.dataAtivacao is a normal date using this format 00/00/0000. It is loaded when the user click to edit.

this.editForm.patchValue({
      dataAtivacao: cliente.dataAtivacao,
});

The issue occurs when I need to update the value of form control because the button is enable only when I click in input and set date again but I need to update without click again to set a date because the date already was loaded.

<button type="submit" id="save-entity"
        [disabled]="editForm.invalid" class="btn btn-primary">
        <span>Save</span>
</button>

edited Dec 13 '19 at 19:17

asked Dec 13 '19 at 16:58

renanvm

Why are you using value attribute in html? – Chellappan வ Dec 13 '19 at 17:23
Is it the issue? – renanvm Dec 13 '19 at 17:33
yes when you use reactive form you don't need value attribute to update the value. patchvalue will internally update the value. – Chellappan வ Dec 13 '19 at 17:38
but now does'nt show the value in input the input show just the placeholder – renanvm Dec 13 '19 at 17:49
In which place you patching value in code? – Chellappan வ Dec 13 '19 at 17:52
on the `ngOnInit()` and I call activatedRoute.data inside it – renanvm Dec 13 '19 at 17:54
and the button keeps disabled – renanvm Dec 13 '19 at 18:02
Can you send the cliente.dataAtivacao data format? – Chellappan வ Dec 13 '19 at 18:05
in this way `2019-12-13` – renanvm Dec 13 '19 at 18:07
You need to specify dataAtivacao as an object (structure) with the year, month and day properties as mentioned in the : https://github.com/ng-bootstrap/ng-bootstrap/issues/1736 – Chellappan வ Dec 13 '19 at 18:08
ok I need to convert – renanvm Dec 13 '19 at 18:14
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/204224/discussion-between-renan-martins-and-chellappan). – renanvm Dec 13 '19 at 18:40

Form control invalid with ngbDatePicker

0 Answers0