The Input Checkbox required property determines whether Input Checkbox is compulsory to check or not.SyntaxFollowing is the syntax −Returning boolean value - true/falseinputCheckboxObject.requiredSetting required to booleanValueinputCheckboxObject.required = booleanValueBoolean ValuesHere, “booleanValue” can be the following −booleanValueDetailstrueIt defines that it is compulsory to check the checkbox to submit form.falseIt is the default value and checking is not compulsory.ExampleLet us see an example of Input Checkbox required property − Live Demo Required Attribute of Checkbox Check me ! I am required: Check if form is submittable    function getRequiredStatus(){       var requiredBool ... Read More

The HTML DOM Input Checkbox Object represents an input HTML element with type checkbox.SyntaxFollowing is the syntax −Creating an with type checkboxvar checkboxObject = document.createElement(“input”); checkboxObject.type = “checkbox”;AttributesHere, “checkboxObject” can have the following attributes −AttributesDescriptionautofocusIt defines if the checkbox should be focused on initial page load.checkedIt defines the state of checkbox i.e. checked/unchecked.defaultCheckedIt returns the default value of checked attribute i.e. true/falsedefaultValueIt sets/returns the default value of checkboxdisabledIt defines if checkbox is disabled/enabledformIt returns a reference of enclosing form that contains the checkboxindeterminateIt sets/returns indeterminate state of checkboxnameIt defines the value of name attribute of a checkboxrequiredIt defines if ... Read More

The HTML DOM Input Checkbox name property returns a string, which is the value of the name attribute of input checkbox. User can also set it to a new string.SyntaxFollowing is the syntax −Returning string valueinputCheckboxObject.nameSetting name attribute to a string valueinputCheckboxObject.name = ‘String’ExampleLet us see an example of Input Checkbox name property − Live Demo Name Attribute of Checkbox Enable new name: Change Name Attribute    function getFormID(){       var oldNameAttr = document.getElementById("formID");       var newNameAttr = document.getElementById("nameAttr");       if(oldNameAttr.checked == true){     ... Read More

The HTML DOM Input Checkbox form property returns the form containing the input checkbox.SyntaxFollowing is the syntax −Returning reference to the form objectinputCheckboxObject.formExampleLet us see an example of HTML DOM Input Checkbox form property − Live Demo Student Details Show Form ID: Get ID of form containing this Checkbox    function getFormID(){       var checkboxFilter = document.getElementById("formID");       var showResultDiv = document.getElementById("showResult");       if(checkboxFilter.checked == true){          showResultDiv.textContent = 'Form ID: ' + checkboxFilter.form.id;       } else {          showResultDiv.textContent = 'Check the checkbox';       }    } OutputThis will produce the following output −Before checking ‘Show Form ID’ checkbox −After checking ‘Show Form ID’ checkbox −

The HTML DOM Input Checkbox disabled property sets/returns whether Input Checkbox is to be enabled or disabled.SyntaxFollowing is the syntax −Returning boolean value − true/falseinputCheckboxObject.disabledSetting disabled to booleanValueinputCheckboxObject.disabled = booleanValueBoolean ValuesHere, “booleanValue” can be the following −booleanValueDetailstrueIt defines that the checkbox is disabled.falseIt defines that the checkbox is not disabled and it is also the default value.ExampleLet us see an example of Input Checkbox disabled property − Live Demo Student Details Biology: Mathematics: Physics: Psychology: Enable Subjects    function enableCheckboxes(){       var enableCheckboxes ... Read More

The HTML DOM select size property returns and modify the value of the size attribute of a drop-down list.SyntaxFollowing is the syntax −Returning sizeobject.sizeModifying valueobject.size = “number”ExampleLet us see an example of HTML DOM select size property − Live Demo    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: radial-gradient( circle farthest-corner at 23.1% 64.6%, rgba(129, 125, 254, 1) 0%, rgba(111, 167, 254, 1) 90% ) no-repeat;       height:100%;    }    p{       font-weight:700;       font-size:1.1rem;    } ... Read More

The HTML DOM Select type property returns the value of the type attribute of drop-down list in an HTML document.SyntaxFollowing is the syntax −object.typeExampleLet us see an example of HTML DOM select type property − Live Demo    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: radial-gradient( circle farthest-corner at 23.1% 64.6%, rgba(129, 125, 254, 1) 0%, rgba(111, 167, 254, 1) 90% ) no-repeat;       height:100%;    }    p{       font-weight:700;       font-size:1.1rem;    }    .drop-down{   ... Read More

The HTML DOM select value property returns and modify the content of the value attribute of a drop-down list.SyntaxFollowing is the syntax −Returning valueobject.valueModifying valueobject.value = true | falseExampleLet us see an example of HTML DOM select value property − Live Demo    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;       height:100%;    }    p{       font-weight:700;       font-size:1.1rem;    }    .drop-down{       width:35%;       ... Read More

The HTML DOM select name property returns and modify the value of the name attribute of the drop-down list in an HTML document.Following is the syntax −Returning nameobject.nameModifying nameobject.name = “text”ExampleLet us see an example of HTML DOM select name property − Live Demo    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;       height:100%;    }    p{       font-weight:700;       font-size:1.2rem;    }    .drop-down{       width:35%;   ... Read More

The HTML DOM select multiple property returns and modify whether multiple options can be selected from a drop-down list or not.SyntaxFollowing is the syntax −Returning multipleobject.multipleModifying multipleobject.multiple = true | falseExampleLet us see an example of HTML DOM select multiple property − Live Demo    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;       height:100%;    }    p{       font-weight:700;       font-size:1.2rem;    }    .drop-down{       width:50%;   ... Read More