Want ability to turn validation off for DatePicker

[Jimeh87]

I have my own Date validation logic and I do not want to use the validation provided by the ngx-date-picker. As far as I can see, there is no way to turn off the validation provided by the DatePicker. Any help or thoughts on this would be appreciated.

[valorkin]

What kind of validation is bothering you?

[Jimeh87]

The client side validation on the date. When using reactive forms you usually add validators when defining the form control (i.e. Validators.required). I found it unexpected that validators were being imposed on the date picker field. Why not provide a validator that could be optionally added? or at least provide a way to turn it off.

[ctrl-brk]

I think @Jimeh87 might refer to the 'invalid date' text toString() returns. I have a similar issue here where I initially thought it's a placeholder text. Anyway, would be nice to show the input even if the date is invalid.

https://github.com/valor-software/ngx-bootstrap/issues/3697

[Jimeh87]

This validation is adding validation errors when using reactive forms. I would like a way to turn off that validation.

[901F]

Thump up for feat I have issue with validator by datepicker and I want to turn it off

[ye2021]

Is this issue is fixed?Is there any way to turn it off default date picker validation?

[pernillah]

I also want to know if there's a solution for this. It interferes with our own validation.

[ASobolewski]

You can separate the text input from the bsDatePicker by using the directive in a span (or you can make a popover I believe) and create a button that whould toggle the datepicker. It would look something like this:

<input class="form-control"
           (keydown.enter)="onInputChange()">
<span class="input-group-btn"
      bsDatepicker
      #datepicker="bsDatepicker"
      [bsValue]="date"
      (bsValueChange)="onBsValueChanged($event)">
</span>
<span class="input-group-btn">
       <button class="btn btn-default"
               type="button"
               (click)="datepicker.toggle()">
       <i class="glyphicon glyphicon-calendar"></i>
</button>

Then you can parse and validate the value from the input however you like, but you will have to handle the date value synchronization between the input and the datepicker.

[eLod]

i also hit this, generally speaking as the issue title/description says there is no way to opt out of the validation logic only, specifically the "filtering mechanism" for the ui using minDate and maxDate can not be used without the validation (for the input variant).

apart from not being able to control if a certain validation is run by datepicker itself, this can cause other issues like the infamous ExpressionChangedAfterItHasBeenCheckedError. for example a naive approach i hit specifically: trying to implement a custom control (ControlValueAccessor) that has its own time picker implementation, uses a form group, that has it's own validation (that puts the errors on the form group itself) will trigger the error, because of the flow:

• "outer" (custom control's) form group is created
• a writeValue writes (an invalid value) into the the group, it sets the controls inside the group and triggers validation, this marks the group invalid but the (child) controls valid (as they do not have validations themselves)
• the child views are created and bsDatepicker is attached to the input, it also runs its own writeValue and triggers the validation, which in turn marks the control invalid
• (i believe) FormControl's NgControlStatus reports the ExpressionChangedAfterItHasBeenCheckedError having ng-valid changing from true to false

of course this is a problem specifically how i naively tried to implement validation between the group and the control, but it required quite some time before i fully grasped what is going on.

for fixing this specific issue one can workaround

• not using the input[bsDatepicker] variant (loosing the ControlValueAccess, so needed to provide it instead, but also not having the Validator part) as mentioned above in this issue
• move the outer component's errors from the group level to the control level (which could be a semantic debate, e.g. where the errors belong, i would say because the errors depend on both the date and time parts it makes sense to add them on the group level)
• not providing min/maxDate (it is already validated in the outer component's group), but again that not only disables validation but also disables ui functionality (filtering dates)

however i think this feature request makes sense without this problematic setup also, as just a way to be able to disable the validation logic provided by the datepicker (the input variant) without losing the "filtering mechanism". this could be a simple validate: boolean input that defaults to true and it could short-circuit validate on the directive.

i am not sure about the logic that resets the value to a known good value on validation failures (eg sets to min/maxDate if needed), i would prefer to have the invalid value and show the error (the same way when i edit the input manually without using the ui to pick a date), but this could be another flag if desired.

(just for the whole picture: i am trying to implement a custom control and validations because i need to have 3 interdependent controls: date, time and timezone parts, and convert dates and validate them accordingly)