表格自动填写时间和日期

Question

I am trying to autofill the time and date of an HTML form and need to use UTC time. I would like to use PHP or javascript.

 <form> <label>Date</label> <input type="date" name="date" value="<?php echo date('Ym-d'); ?>"> <br /> <label>Time</label> <input type="time" name="time"/ value=""> </form>

Thanks in advance.

Answer 1

You just need to add <?= date('H:i'); ?> <?= date('H:i'); ?> in your time input.

<input type="time" name="time"/ value="<?= date('H:i'); ?>">

For explanation:

<?=date('H:i');?> is the same like: <?php echo date('H:i');?>

And the 'H' are the hours in 24-hour-format and 'i' are the minutes with leading zeros.

You can take a look at https://www.php.net/manual/en/function.date.php for different possibilities to format a date.

Answer 2

With JavaScript, the Date object is used to retrieve the time & date. To pre-populate your two input fields with the time and date respectively you first need to get a reference to them to be able to manipulate it using JavaScript.

Both of the input fields have it's name tag set, so we can use this.

var inputElementTime=document.getElementsByName("time")[0];
var inputElementDate=document.getElementsByName("date")[0];

The function getElmentsByName returns an array, since there can be multiple elements with the same name. In your case there's just one so we can directly use the first element of the array by appending [0] .

Now we need to get the actual date:

var now=new Date();

The input elements .value property needs to be formatted in a special way. For the time it should be hh:mm and for the date: yyyy-mm-dd

Note: hh, mm, and dd always need to have 2 digits. If it's the first of June you have to add a leading zero eg 01 .

Here's the complete example (just click on 'Run code snippet'):

 var now = new Date(); var inputElementTime = document.getElementsByName("time")[0]; var inputElementDate = document.getElementsByName("date")[0]; inputElementTime.value = ("0" + now.getHours()).slice(-2) + ":" + ("0" + now.getMinutes()).slice(-2); inputElementDate.value = now.getUTCFullYear() + "-" + ("0" + now.getMonth()).slice(-2) + "-" + ("0" + now.getDate()).slice(-2);

 <form> <label>Date</label> <input type="date" name="date"> <br /> <label>Time</label> <input type="time" name="time"> </form>

Answer 3

Here is a way using Date(); funtion

 let objectDate = new Date(); var time = objectDate.toLocaleTimeString([], { hourCycle: 'h24', hour: '2-digit', minute: '2-digit' }); var date = objectDate.toLocaleDateString('sv'); document.getElementById('time').value = time; document.getElementById('datePicker').value = date;

 <div class="form-check form-check-inline"> <label for="appt">Time:</label> <input type="time" id="time" name="appt" min="09:00" max="18:00" required> </div> <label for="start">Date:</label> <input type="date" id="datePicker" value="2018-07-22">