[X]

Javascript Alert, Prompt, Confirm and Write function - (Learning Javascript Series)

Javascript functions: alert, prompt, confirm and write

Alert, prompt and document.write functions are most commonly used for user interaction and writing some content on browser window.

  • Alert is used to display some warning message window
  • Prompt is used to capture user input
  • Confirm is used to capture Yes/No or OK/Cancel response from user in order to perform further activity
  • Write is used to write some text on browser window.

Below are some examples of using these functions.

 

Using Alert function:

 

var browserInfo = '';
        browserInfo = "Browser CodeName: " + navigator.appCodeName + "\n\r";
        browserInfo += "Browser Name: " + navigator.appName + "\n\r";
        browserInfo += "Browser Version: " + navigator.appVersion + "\n\r";
        browserInfo += "Cookies Enabled: " + navigator.cookieEnabled + "\n\r";
        browserInfo += "Platform: " + navigator.platform + "\n\r";
        browserInfo += "User Agent: " + navigator.userAgent + "\n\r";
        alert(browserInfo);

 

 

 

Using Prompt Function:

 

var num1 = prompt("Enter first number", "Number Prompt");
            var num2 = prompt("Enter second number", "Number Prompt");

            var sum = 0;
            if (num1 != null && num2 != null) { sum =parseInt(num1) + parseInt(num2); }

            var divPrompt = document.getElementById("divPrompt");
            if (divPrompt != null) {
                divPrompt.innerHTML = "You entered<br/>"
                + "Num1: " + num1
                + "<br/>Num2: " + num2
                + "<br/>And Sum = " + sum;

 

 

Using Confirm function:

 

<div>

        <script type="text/javascript">
            function CloseWindow() {
                var result = confirm("Are you sure to close this window?");
                if (result) { window.close(); }
            }
        </script>

        <input type="button" onclick="CloseWindow();" value="Close this window" />
    </div>

 

 

 

Using document.write function:

 

<script type="text/javascript">
        document.write("This text was creating using document.write() function.<br/>");
    </script>

 

 

Below is the complete code for showing use of alert, prompt and write function.

 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AlertPromptWrite.aspx.cs" Inherits="JavaScriptBasics.AlertPromptWrite" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <script type="text/javascript">
        var browserInfo = '';
        browserInfo = "Browser CodeName: " + navigator.appCodeName + "\n\r";
        browserInfo += "Browser Name: " + navigator.appName + "\n\r";
        browserInfo += "Browser Version: " + navigator.appVersion + "\n\r";
        browserInfo += "Cookies Enabled: " + navigator.cookieEnabled + "\n\r";
        browserInfo += "Platform: " + navigator.platform + "\n\r";
        browserInfo += "User Agent: " + navigator.userAgent + "\n\r";
        alert(browserInfo);
    
        function alertMe() {
            alert("You clicked on AlertMe button.");
        }
        function promptForSum() {
            var num1 = prompt("Enter first number", "Number Prompt");
            var num2 = prompt("Enter second number", "Number Prompt");

            var sum = 0;
            if (num1 != null && num2 != null) { sum =parseInt(num1) + parseInt(num2); }

            var divPrompt = document.getElementById("divPrompt");
            if (divPrompt != null) {
                divPrompt.innerHTML = "You entered<br/>"
                + "Num1: " + num1
                + "<br/>Num2: " + num2
                + "<br/>And Sum = " + sum;
                
            }
            
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <script type="text/javascript">
        document.write("This text was creating using document.write() function.<br/>");
    </script>
    <input type="button" value="Alert Me" onclick="alertMe();" />
    <br />
    <input type="button" value="Click to Get Sum of 2 Numbers" onclick="promptForSum();" />
    <div id="divPrompt"></div>
    
    </div>
    </form>
</body>
</html>

 

 

blog comments powered by Disqus

Posts By Month