Input field with type date or type text

Question

I have a Laravel app with a date field.

When I use "type=text"

<input type="date" class="form-control" id="startdate" placeholder="Start date" name="startdate" />

I get the value that is stored in my database.

When I use "type=date"

<input type="date" class="form-control" id="startdate" placeholder="Start date" name="startdate" />

I get dd/mm/yyyy and a dropdown (datepicker) to select a number for each of these. I would have expected that the dd, mm and yyyy would be pre-filled with the date from my database.

While input=text is working, I don't like that as the uses can then type in any text in that field.

What is the best way to do this? Keep the input=date and fix that or put it to input=text and do server side validation?

Answer 1

Try this

function getDefaultDate(curDate){
var dt = new Date(curDate);
var date = dt.getDate();
var month = dt.getMonth();
var year = dt.getFullYear();
if (month.toString().length == 1) {
    month = "0" + month
}
if (date.toString().length == 1) {
    date = "0" + date
}
return year.toString() + "-" + month.toString() + "-" + date.toString();
}

var fdate = getDefaultDate(curDate); // pass db date

document.getElementById("startdate").value = fdate;