JavaScript POP UP Boxes

In JavaScript We can create three type of popup boxes.

  1. Alert Box
  2. Confirm Box
  3. Prompt Box

Alert Box

We use Alert Box When we want to make sure information comes through to the user.

When an alert box pops up,Then user will need to click "OK" to proceed.

Syntax

alert("Your Custom Text");

Example

<button onclick="myAlertBox()">Try Alert Box</button>
<script language="javascript" type="text/javascript" >
function myAlertBox() {
    alert("My Alert box!");
}
</script>

Confirm Box

We use Confirm Box When We want user verify or or accept something.

When an confirm box pops up,Then user will need to click "OK" Or "Cancel" to proceed.

If the user clicks "Cancel", then box returns false.And If the user clicks "OK", then box returns true.

Syntax

confirm("Your Custom Text");

Example

<button onclick="myConfirmBox()">Try Confirm Box</button>
<script language="javascript" type="text/javascript" >
 function myConfirmBox() {
        var result =confirm("My Confirm box!");
    if (result == true) {
      alert("You pressed OK!");
      } else {
            alert("You pressed Cancel!");
        
      } 
    }
</script>

Prompt Box

We use Prompt Box When We want user input a value before entering a page.

When an Prompt box pops up,Then user will need to click "OK" Or "Cancel" to proceed.

If the user clicks "Cancel", then box returns null.And If the user clicks "OK", then box returns the input value.

Syntax

prompt("My Prompt box!","Default Value");

Example

<button onclick="myPromptBox()">Try Prompt Box</button>
<script language="javascript" type="text/javascript" >
   function myPromptBox() {
        var result = prompt("My Prompt box!","Default Value");
  if (result != null) {
      alert("Hello " + result + "!");
      } else {
            alert("You pressed Cancel!");
        
      } 
    }
</script>