CODEWITHSUNDEEP
datevue.jsinput
No One
No One

Reputation: 683

Vuejs: Insert date today in input

I am using an input for the date. How do we set the Input to display the Date Today? Thank you for your time.

                            <div class="form-group">
                                <label>Debarred</label>
                                <input v-model="form.debarred" type="date" name="debarred"
                                       placeholder="Debarred"
                                       class="form-control" :class="{ 'is-invalid': form.errors.has('debarred') }">
                                <has-error :form="form" field="debarred"></has-error>
                            </div>

Upvotes: 0

Views: 2654

Answers (1)

palaѕн
palaѕн

Reputation: 73896

You can update the model value form.debarred on page load like:

this.form.debarred = new Date().toLocaleDateString('en-CA');
//==> "2020-04-03"

Now, using .toLocaleDateString('en-CA') is need here as <input type="date"> value can only accept a string representing a date in YYYY-MM-DD format, or empty.

DEMO:

const debarred = document.querySelector('[name=debarred]');
debarred.value = new Date().toLocaleDateString('en-CA');
<div class="form-group">
  <label>Debarred</label>
  <input type="date" name="debarred" placeholder="Debarred" class="form-control">
  <has-error :form="form" field="debarred"></has-error>
</div>

Upvotes: 1

Related Questions