Validate date using v-validate in Vue.js

Question

I want to allow only those date that are equal to or greater than the departure date time field:

<tr v-for="(input,k) in inputs" :key="k">
  <datetime 
    name="departureDateTime"
    v-validate="'date_format:yyyy-MM-dd HH:mm:ss|required'"
    v-model="input.departureDateTime"
  >
  </datetime>

  <datetime 
    name="arrivalDateTime"        👇
    v-validate="`after:${input.departureDateTime}|date_format:yyyy-MM-dd HH:mm:ss|required`"
    v-model="input.arrivalDateTime"
  >
  </datetime>
<tr>

This is only allowing me dates which are after departureDateTime field in arrival field, but i also want it should allow the same date also i.e. if i fill 27-05-2021 in departure time then it should allow the same date in arrivalDateTime field also and i want to allow only future dates to be filled in both the date fields.

Any help is highly appreciated.

tony19 · Accepted Answer · 2021-05-27 05:05:33Z

1

after params are:

after:target,inclusion

...where the inclusion flag (any value) specifies whether to check for dates greater than or equal to target.

So just add ,true after the target date:

<datetime 
  name="arrivalDateTime"                         👇
  v-validate="`after:${input.departureDateTime},true|date_format:yyyy-MM-dd HH:mm:ss|required`"
  v-model="input.arrivalDateTime"
>
</datetime>

demo

answered May 27, 2021 at 5:05

tony19

140k23 gold badges281 silver badges354 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Validate date using v-validate in Vue.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related