HTML DOM Input URL required Property

HTMLWeb DevelopmentFront 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 −

booleanValueDetails
TrueIt is compulsory to set the url field to submit form.
FalseIt 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>

Output

This will produce the following output −

Clicking ‘Go’ button −

After clicking ‘Go’ button with value of an url field set −

raja
Published on 26-Jul-2019 12:40:42
Advertisements