HTML DOM Input URL required Property

HTML Web Development Front End Technology

The Input URL required property determines whether Input URL is compulsory to set or not.

Syntax

Following is the syntax −

Returning boolean value - true/false

inputURLObject.required

Setting required to booleanValue

inputURLObject.required = booleanValue

Boolean Values

Here, “booleanValue” can be the following −

booleanValue	Details
True	It is compulsory to set the url field to submit form.
False	It is the default value and to set an url field is not compulsory.

Example

Let us see an example for Input URL required property −

Live Demo

<!DOCTYPE html>
<html>
<head>
<title>Input URL required</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>
<fieldset>
<legend>URL-required</legend>
<label for="URLSelect">URL:
<input type="url" id="URLSelect" required>
</label><br>
<input type="button" onclick="showMessage()" value="Go">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputURL = document.getElementById("URLSelect");
   function showMessage() {
      if(inputURL.required === true && inputURL.value === '')
         divDisplay.textContent = 'Cannot Redirect: URL is Required';
      else
         divDisplay.textContent = 'Redirecting...';
   }
</script>
</body>
</html>