Vuetify: [Bug Report] Date Range picker display '2 selected' instead of displaying the total number of dates (the difference between 2 dates)

Created on 5 Nov 2019  路  3Comments  路  Source: vuetifyjs/vuetify

Environment

Vuetify Version: 2.1.9
Vue Version: 2.6.10
Browsers: Chrome 77.0.3865.120
OS: Linux x86_64

Steps to reproduce

  1. Open a date range picker
  2. Pick a date
  3. Pick another date (more than 2)
  4. It will display 2 selected

Expected Behavior

It should display the total number of dates

Actual Behavior

It will display '2 selected' instead of displaying the total number of dates

Reproduction Link

https://codepen.io/mahammad8564-the-animator/pen/zYYWwgQ?&editable=true&editors=101

VDatepicker feature

Most helpful comment

IMHO it should rather display the first and last date instead of number of days between them

All 3 comments

IMHO it should rather display the first and last date instead of number of days between them

I +1 that the current behavior with an huge '2 selected' above the calendar is kinda confusing to the end user and provide no useful information as the range is already visible when two date are selected. I think i'm gonna hack it to hide it in our current project. (it's that bad :) )

Change the default to the actual range duration or the two dates are fine solution to me. a range-label properties to customise it would be cool too.

@engyii range-label is a good solution, is there something I can help you with? I want to contribute.

Was this page helpful?
0 / 5 - 0 ratings