HTML DOM Input Week Object

The HTML DOM Input Week Object represents an input HTML element with type week.

Syntax

Following is the syntax −

Creating an <input> with type Week

var weekObject = document.createElement(“INPUT”);
weekObject.type = “week”;

Attributes

Here, “weekObject” can have the following attributes −

Attributes	Description
autocomplete	It defines the value of autocomplete attribute of a week field
autofocus	It defines if the week field should be focused on initial page load.
defaultValue	It sets/returns the default value of week field
disabled	It defines if week field is disabled/enabled
form	It returns a reference of enclosing form that contains the week field
max	It returns/sets the value of max attribute of week field
min	It returns/sets the value of min attribute of week field
name	It defines the value of name attribute of a week field
readOnly	It defines if the week field is read only or not
required	It defines if the week field is compulsory to be filled in order to submit the form
step	It defines the value of the step attribute of week field
type	It returns the type of form element of week field
value	It defines the value of the value attribute of a week field

Methods

And, also the following methods −

booleanValue	Details
stepDown	It defines the amount of weeks the week field should decrease.
stepUp	It defines the amount of weeks the week field should increase.

Example

Let us see an example for Input Week form property −

<!DOCTYPE html>
<html>
<head>
<title>Input Week form</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form id="Mid-Term">
<fieldset>
<legend>Week-form</legend>
<label for="WeekSelect">Examination Week:
<input type="week" id="WeekSelect" value="2019-W36">
</label>
<input type="button" onclick="showExamination()" value="What exams are in this week? ">
<div id="divDisplay"></div>
</fieldset>
</form><script>
   var divDisplay = document.getElementById("divDisplay");
   var inputWeek = document.getElementById("WeekSelect");
   function showExamination() {
      divDisplay.textContent = 'Examinations: '+inputWeek.form.id;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Before clicking ‘What exams are in this week?’ button −

HTML DOM Input Week Object

After checking ‘What exams are in this week?’ button −

HTML DOM Input Week Object