Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

fix(VDatePicker): programmatic start date with multiple range #20169

Conversation

zentek-cintia-dewi
Copy link
Contributor

Description

Fix: When a startDate is set programmatically after Date Picker is rendered, rangeStart value should also be updated. So that when we click a date for the end date, the rangeStart won't get reset into what we click as endDate.

Resolves #20168

Markup:

<template>
  <v-app>
    <v-container>
      <v-btn @click="handleSetDeliveryDateToEarliestPossible">
        Set {{ earliestPossibleDeliveryDate.toLocaleDateString('de-DE') }} as
        initial start date
      </v-btn>
      <v-date-picker
        v-model="selectedDateRange"
        color="secondary"
        multiple="range"
        width="100%"
        hide-header
        show-adjacent-months
      />
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref } from 'vue';
  const selectedDateRange = ref([])
  const earliestPossibleDeliveryDate = ref(new Date()) // can be any date, here it's today for simplicity
  function handleSetDeliveryDateToEarliestPossible () {
    selectedDateRange.value = [earliestPossibleDeliveryDate.value]
  }
</script>

fix(VDatePickerMonth): range bug with programmatic startdate
resolves vuetifyjs#20168
@zentek-cintia-dewi zentek-cintia-dewi force-pushed the v-datepicker-month-range-start-date-programmatically branch from ed4c637 to 4d3ae5f Compare July 15, 2024 15:24
@blalan05 blalan05 self-requested a review July 15, 2024 18:30
@blalan05 blalan05 added this to the v3.6.x milestone Jul 15, 2024
@johnleider johnleider added T: bug Functionality that does not work as intended/expected C: VDatePicker labels Jul 16, 2024
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
C: VDatePicker T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug Report][3.6.12] v-date-picker range resetting startdate when clicked in calendar
3 participants