HTML DOM Input Week Object

HTMLWeb DevelopmentFront End Technology

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 −

AttributesDescription
autocompleteIt defines the value of autocomplete attribute of a week field
autofocusIt defines if the week field should be focused on initial page load.
defaultValueIt sets/returns the default value of week field
disabledIt defines if week field is disabled/enabled
formIt returns a reference of enclosing form that contains the week field
maxIt returns/sets the value of max attribute of week field
minIt returns/sets the value of min attribute of week field
nameIt defines the value of name attribute of a week field
readOnlyIt defines if the week field is read only or not
requiredIt defines if the week field is compulsory to be filled in order to submit the form
stepIt defines the value of the step attribute of week field
typeIt returns the type of form element of week field
valueIt defines the value of the value attribute of a week field

Methods

And, also the following methods −

booleanValueDetails
stepDownIt defines the amount of weeks the week field should decrease.
stepUpIt defines the amount of weeks the week field should increase.

Example

Let us see an example for Input Week form property −

 Live Demo

<!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 −

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

raja
Published on 26-Jul-2019 17:46:01
Advertisements