* New post Constructor Destructor and Inheritance& Array , Virtual base class in c++ language

Tuesday, 7 May 2013

0 Dialog Boxes in Javascript

Dialog Boxes In Javascript
It can provide the ability to pickup user input  or display small amount of text to the user by using dialogboxes. These dialog box appear as seperate windows and their content depends on the information provided by the user . This content is independent of the text in the Html page containing the javascript  script and does not affect the content of the page in any way.
There are three types of dialogboxes provided by Javascript  such as : 
  • Alerts Dialog box = The simplest way to direct small amount of textual output to a browser 's window is to use an alert dialog box. The javascript alert() method takes a string as an argument and displays an alert dialog box in the browser windows when invoked by appropriate javascript.
The alert dialog box displays the string passed to the alert() method , as well as ok button .The javascript and the HTML program , in this code snippet is held , will continue procesing until the ok button is clicked . 
The alert dialog box can be used to display a cautionary message or display some information for instance :
1.     A message is displayed to the user when incorrect information is keyed in a form. 
2.     An invalid result is the output of a calculation .
3.     A warning that a service is not available on a given date/ time.
Syntax:
              alert("<message>");
        Example:
               alert("click text to continue"); 
  • Prompt Dialog Box = The Alert dialog box simply displays information in a browser and does not any interaction . Javascript can provide a prompt dialog box for this . In addtion , the prompt dialog box also provide a single dta entry field , that accept user input . Thus a prompt dialog box :
1.     Display a predefined message .
2.     Display a textbox and accept user input.
3.     Displays the ok and the cancel button.
When the prompt() method is used to instantiate and use a dialog box the method requires two blocks of the information:
1.     A message is to be displayed as a prompt to the user.
2.     Any message to be displayed in the textbox. 
Syntax:
          prompt("<message>","<default vakue>");
Example: 
          prompt("Enter the favourite website: , "yfc"

  • Confirm Dialog Box = Javascript can provides a third type of a dialog box , called the confirm dialog box . As the name suggests , this dialog box serves as a technique for confirming user action . The confirm dialog box displays the following information :
1.     A pre-defined message.
2.     ok and cancel button.
 The confirm dialog box , causes program execution to halt user action takes place . User action can be either the ok button being clicked , or the cancel buton being clicked , that causes the folllowing action to take place .
1.     Clicking on the ok button causes true to be passed to the program that called the confirm dialog box.
2.     Clicking on the cancel button causes false to be passed to the program that called the confirm dialog box.
 Syntax:
         confirm ("<message>");
Example:
        confirm("Are you sure you want to exit the website"); 
 Examlpe:
                    Ask a question and accept an answers
<html>
<head>
<title> confirm method</title>
<SCRIPT LANGUAGE = "javascript" 
var question = "what is 20 +20?";
var answers = 40;
var correct = '<img src = "images /ww.gif"/>';
var incorrect= '<img src = "images/www.gif"/>;
var response = prompt(question, "0");
for(count = 0; count<4; count ++)
   {
      if (response != answers)
   {
      confirm ("wrong, press ok for another chance ");
      response = prompt(question, "0");
       if (count ==1);
  {
     alert("betterluck next time ");
  }
}
else
      {
          alert ("great !! you are right ");
           count = 4;
}
  }
    var output  = ( response == answers )? correct : incorrect;
    document.write("BR/>");
    document.write(output);
</script>
</head>
<body> </body>
</html>


  

0 comments:

Post a Comment

 

PROGRAMMINGqueen Copyright © 2011 - |- Template created by O Pregador - |- Powered by Blogger Templates

Blogger Widgets