HTML DOM Input Datetime readOnly Property

HTMLWeb DevelopmentFront End Technology

The HTML DOM Input Datetime readOnly property sets/returns whether Input Datetime can be modified or not.

Following is the syntax −

  • Returning boolean value - true/false
  • Setting readOnly to booleanValue
inputDatetimeObject.readOnly = booleanValue

Boolean Values

Here, “booleanValue” can be the following −

trueIt defines that the input datetime is readOnly.
falseIt defines that the input datetime is not readOnly and can be modified.

Let us see an example of Input Datetime readOnly property −

 Live Demo

<!DOCTYPE html>
<title>Input Datetime readOnly</title>
Final Exam Datetime: <input type="datetime" id="datetimeSelect" value="2023-08-24T10:30Z">
<button onclick="finalizeDatetime()">Confirm Datetime</button>
<div id="divDisplay"></div>
   var divDisplay = document.getElementById("divDisplay");
   var inputDatetime = document.getElementById("datetimeSelect");
   divDisplay.textContent = 'Exam Datetime Finalized: '+inputDatetime.readOnly;
   function finalizeDatetime() {
      inputDatetime.readOnly = true;
      divDisplay.textContent = 'Exam Datetime: '+inputDatetime.value;


This will produce the following output −

Before clicking ‘Confirm Datetime’ button −

After clicking ‘Confirm Datetime’ button −

Published on 23-Jul-2019 17:54:33