HTML | DOM Input DatetimeLocal readOnly Property
The Input DatetimeLocal readOnly property is used to set or return whether a datetimeLocal field should be read-only, or not. Once a field has been declared read-only, it cannot be further modified. However, the read-only field can be tabbed, highlighted and can be used for copying text. The HTML readonly attribute is reflected by the Input DatetimeLocal readOnly property.
Syntax:
- To return the readOnly property:
datetimelocalObject.readOnly
- To set the readOnly property:
datetimelocalObject.readOnly = true|false
Property Value:
- true|false : It is used to specify whether the datetimeLocal field will be read-only or not. It is false by default.
Return Value : It returns a Boolean value that represents whether the Input DateTimeLocal field would be readOnly or not.
Below program illustrates the DatetimeLocal readOnly property :
Example: Setting a datetimeLocal field to read-only.
html
<!DOCTYPE html><html><head> <title> Input DatetimeLocal readOnly Property in HTML </title> <style> h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </style></head><body> <h1>GeeksforGeeks</h1> <h2> Input DatetimeLocal readOnly Property </h2> <br> Date Of Birth: <input type="datetime-local" id="Test_DatetimeLocal" name="DOB"> <p> To set the date time to read-only, double-click the "Set Read-Only" button. </p> <button ondblclick="My_DatetimeLocal()"> Set Read-Only </button> <script> function My_DatetimeLocal() { document.getElementById( "Test_DatetimeLocal").readOnly = true; } </script></body></html> |
Output:
After clicking the button:
Note : The <input type=”datetime-local”> element does not show any datetime field/calendar in Firefox.
Supported Browsers:
- Apple Safari
- Internet Explorer
- Firefox
- Google Chrome
- Opera
.png)
