CODEWITHSUNDEEP
angularvalidation
Emmon
Emmon

Reputation: 385

Angular: Validate a date input based on the selection of another date input

I have two input fields: InvoiceDate and InvoiceDueDate. I need to validate the InvoiceDueDate such that it starts 30 days after the selected InvoiceDate.

Currently, I have the InvoiceDueDate validated to not less than the InvoiceDate by binding it to [min]="invoice.invoiceDate"

 <div class="col-sm-2">
                    <label>Invoice Date</label><br>
                    <input type="date" [disabled]="true" name="invoicedate" class="form-control readOnly-date" [(ngModel)]="invoice.invoiceDate" *ngIf="!invoice.financialPeriodId">
                    <input type="date" name="invoicedate" min="{{startDate | date: 'yyyy-MM-dd'}}" max="{{endDate | date: 'yyyy-MM-dd'}}" class="form-control" [(ngModel)]="invoice.invoiceDate" *ngIf="invoice.financialPeriodId">
                </div>

                <div class="col-sm-2">
                    <label>Due Date</label><br>
                    <input type="date" name="dueDate" class="form-control readOnly-date" [(ngModel)]="invoice.invoiceDueDate" *ngIf="!invoice.invoiceDate">
                    <input type="date" name="dueDate" [min]="invoice.invoiceDate" class="form-control" [(ngModel)]="invoice.invoiceDueDate">
                </div>

The InvoiceDueDate should be set to 30 days from the date selected on InvoiceDate. example: if (InvoiceDate is 01-10-2019) then InvoiceDueDate should be 02-11-2019

Upvotes: 0

Views: 64

Answers (1)

Hiras Haris
Hiras Haris

Reputation: 498

public minDate: newDat();

minDate = this.invoice.invoiceDate.setDate(this.invoice.invoiceDate.getDate() + 30);

and in your HTML you can use [min]="minDate"

hope this helps you!

Upvotes: 3

Related Questions