logging in or signing up JavaScript mishrajibitesh Download Post to : URL : Related Presentations : Share Add to Flag Embed Email Send to Blogs and Networks Add to Channel Uploaded from authorPOINT lite Insert YouTube videos in PowerPont slides with aS Desktop Copy embed code: (To copy code, click on the text box) Embed: URL: Thumbnail: WordPress Embed Customize Embed The presentation is successfully added In Your Favorites. Views: 390 Category: Education License: All Rights Reserved Like it (0) Dislike it (0) Added: February 13, 2010 This Presentation is Public Favorites: 1 Presentation Description No description available. Comments Posting comment... By: ddeepthi (16 month(s) ago) send me this ppt to my mail id please duggineni.deepthi@gmail.com Saving..... Post Reply Close Saving..... Edit Comment Close Premium member Presentation Transcript Java Script : Java Script Week 7 & 8 Javascript Popup Boxes : Javascript Popup Boxes ©Jibitesh Mishra, mishrajibitesh@gmail.com JavaScript has three kind of popup boxes e.g. Alert box, Confirm box and Prompt box. An alert box is often used if you want to make sure information comes through to the user. When an alert box pops up, the user will have to click "OK" to proceed. Alert Dialog Box : Alert Dialog Box <HTML> <HEAD> <TITLE>Lab 1</TITLE> </HEAD> <BODY> <FORM name="myform"> <INPUT type="text" name="myTextInput" size=30 maxlength=30 ©Jibitesh Mishra, mishrajibitesh@gmail.com Alert Dialog Box : Alert Dialog Box value="this is a 1 line text box"> <P> <INPUT type="button" name="myButton" value="A Button" onClick='alert("Enter some information")'> </FORM> </BODY> </HTML> ©Jibitesh Mishra, mishrajibitesh@gmail.com Alert Dialog Box : Alert Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Use of function with Alert : Use of function with Alert A function can also be used to display the alter message as given in the next example. ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Alert thru function : Example of Alert thru function <html> <head> <script type="text/javascript"> function show_alert() { alert("I am an alert box!"); } </script> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Alert cont.. : Example of Alert cont.. </head> <body> <input type="button" onclick="show_alert()" value="Show alert box" /> </body> </html> ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Dialog Box : Confirm Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Confirm & Prompt Dialog Boxes : Confirm & Prompt Dialog Boxes Two other Dialog boxes are available in the window object e.g. confirm & prompt Some of the more popular event handlers that can be used are onLoad, onUnload, and onBlur in the Window Object onClick, onMouseOver and onMouseOut in the Link Object ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Box : Confirm Box A confirm box is often used if you want the user to verify or accept something. When a confirm box pops up, the user will have to click either "OK" or "Cancel" to proceed. If the user clicks "OK", the box returns true. If the user clicks "Cancel", the box returns false. ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Dialog Box : Confirm Dialog Box <HTML> <FORM name="myform"> <INPUT type="text" name="myTextInput” size=30 maxlength=30 value="this is a 1 line text box"> <P> <INPUT type="button" name="myButton“ value="A Button" onClick='confirm("Enter some information")'> </FORM> ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Dialog Box : Confirm Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Confirm Dialog Box : Confirm Dialog Box In order to give some message on pressing OK or Cancel, we can use function. ©Jibitesh Mishra, mishrajibitesh@gmail.com Use of function with Confirm : Use of function with Confirm <html> <head> <script type="text/javascript"> function show_confirm() { var r=confirm("Press a button"); if (r==true) { document.write("You pressed OK!"); } ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Confirm cont.. : Example of Confirm cont.. else { document.write("You pressed Cancel!"); } } </script> </head> <body> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Confirm cont.. : Example of Confirm cont.. <input type="button" onclick="show_confirm()" value="Show a confirm box" /> </body> </html> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Confirm cont.. : Example of Confirm cont.. ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Then on clicking OK button You Pressed OK ! will come Then on clicking Cancel button You Pressed Cancel ! will come Prompt Box : Prompt Box A prompt box is often used if you want the user to input a value before entering a page. When a prompt box pops up, the user will have to click either "OK" or "Cancel" to proceed after entering an input value. If the user clicks "OK" the box returns the input value. If the user clicks "Cancel" the box returns null. ©Jibitesh Mishra, mishrajibitesh@gmail.com Prompt Dialog Box : Prompt Dialog Box <HTML> <FORM name="myform"> <INPUT type="text" name="myTextInput” size=30 maxlength=30 value="this is a 1 line text box"> <P> <INPUT type="button” name="myButton“ value="A Button" onClick='prompt("Enter some information")'> </FORM> </HTML> </BODY> </HTML> ©Jibitesh Mishra, mishrajibitesh@gmail.com Prompt Dialog Box : Prompt Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com Use of function with Prompt : Use of function with Prompt <html> <head> <script type="text/javascript"> function show_prompt() { var name=prompt("Please enter your name","Harry Potter"); if (name!=null && name!="") { ©Jibitesh Mishra, mishrajibitesh@gmail.com Example with Prompt cont… : Example with Prompt cont… document.write("Hello " + name + "! How are you today?"); } } </script> </head> <body> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example with Prompt cont… : Example with Prompt cont… <input type="button" onclick="show_prompt()" value="Show a prompt box" /> </body> </html> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example with Prompt cont… : Example with Prompt cont… ©Jibitesh Mishra, mishrajibitesh@gmail.com If type Jibitesh Mishra & press OK button It will come as You do not have the permission to view this presentation. In order to view it, please contact the author of the presentation.
JavaScript mishrajibitesh Download Post to : URL : Related Presentations : Share Add to Flag Embed Email Send to Blogs and Networks Add to Channel Uploaded from authorPOINT lite Insert YouTube videos in PowerPont slides with aS Desktop Copy embed code: (To copy code, click on the text box) Embed: URL: Thumbnail: WordPress Embed Customize Embed The presentation is successfully added In Your Favorites. Views: 390 Category: Education License: All Rights Reserved Like it (0) Dislike it (0) Added: February 13, 2010 This Presentation is Public Favorites: 1 Presentation Description No description available. Comments Posting comment... By: ddeepthi (16 month(s) ago) send me this ppt to my mail id please duggineni.deepthi@gmail.com Saving..... Post Reply Close Saving..... Edit Comment Close Premium member Presentation Transcript Java Script : Java Script Week 7 & 8 Javascript Popup Boxes : Javascript Popup Boxes ©Jibitesh Mishra, mishrajibitesh@gmail.com JavaScript has three kind of popup boxes e.g. Alert box, Confirm box and Prompt box. An alert box is often used if you want to make sure information comes through to the user. When an alert box pops up, the user will have to click "OK" to proceed. Alert Dialog Box : Alert Dialog Box <HTML> <HEAD> <TITLE>Lab 1</TITLE> </HEAD> <BODY> <FORM name="myform"> <INPUT type="text" name="myTextInput" size=30 maxlength=30 ©Jibitesh Mishra, mishrajibitesh@gmail.com Alert Dialog Box : Alert Dialog Box value="this is a 1 line text box"> <P> <INPUT type="button" name="myButton" value="A Button" onClick='alert("Enter some information")'> </FORM> </BODY> </HTML> ©Jibitesh Mishra, mishrajibitesh@gmail.com Alert Dialog Box : Alert Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Use of function with Alert : Use of function with Alert A function can also be used to display the alter message as given in the next example. ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Alert thru function : Example of Alert thru function <html> <head> <script type="text/javascript"> function show_alert() { alert("I am an alert box!"); } </script> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Alert cont.. : Example of Alert cont.. </head> <body> <input type="button" onclick="show_alert()" value="Show alert box" /> </body> </html> ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Dialog Box : Confirm Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Confirm & Prompt Dialog Boxes : Confirm & Prompt Dialog Boxes Two other Dialog boxes are available in the window object e.g. confirm & prompt Some of the more popular event handlers that can be used are onLoad, onUnload, and onBlur in the Window Object onClick, onMouseOver and onMouseOut in the Link Object ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Box : Confirm Box A confirm box is often used if you want the user to verify or accept something. When a confirm box pops up, the user will have to click either "OK" or "Cancel" to proceed. If the user clicks "OK", the box returns true. If the user clicks "Cancel", the box returns false. ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Dialog Box : Confirm Dialog Box <HTML> <FORM name="myform"> <INPUT type="text" name="myTextInput” size=30 maxlength=30 value="this is a 1 line text box"> <P> <INPUT type="button" name="myButton“ value="A Button" onClick='confirm("Enter some information")'> </FORM> ©Jibitesh Mishra, mishrajibitesh@gmail.com Confirm Dialog Box : Confirm Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Confirm Dialog Box : Confirm Dialog Box In order to give some message on pressing OK or Cancel, we can use function. ©Jibitesh Mishra, mishrajibitesh@gmail.com Use of function with Confirm : Use of function with Confirm <html> <head> <script type="text/javascript"> function show_confirm() { var r=confirm("Press a button"); if (r==true) { document.write("You pressed OK!"); } ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Confirm cont.. : Example of Confirm cont.. else { document.write("You pressed Cancel!"); } } </script> </head> <body> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Confirm cont.. : Example of Confirm cont.. <input type="button" onclick="show_confirm()" value="Show a confirm box" /> </body> </html> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example of Confirm cont.. : Example of Confirm cont.. ©Jibitesh Mishra, mishrajibitesh@gmail.com On clicking button this will come -- Then on clicking OK button You Pressed OK ! will come Then on clicking Cancel button You Pressed Cancel ! will come Prompt Box : Prompt Box A prompt box is often used if you want the user to input a value before entering a page. When a prompt box pops up, the user will have to click either "OK" or "Cancel" to proceed after entering an input value. If the user clicks "OK" the box returns the input value. If the user clicks "Cancel" the box returns null. ©Jibitesh Mishra, mishrajibitesh@gmail.com Prompt Dialog Box : Prompt Dialog Box <HTML> <FORM name="myform"> <INPUT type="text" name="myTextInput” size=30 maxlength=30 value="this is a 1 line text box"> <P> <INPUT type="button” name="myButton“ value="A Button" onClick='prompt("Enter some information")'> </FORM> </HTML> </BODY> </HTML> ©Jibitesh Mishra, mishrajibitesh@gmail.com Prompt Dialog Box : Prompt Dialog Box ©Jibitesh Mishra, mishrajibitesh@gmail.com Use of function with Prompt : Use of function with Prompt <html> <head> <script type="text/javascript"> function show_prompt() { var name=prompt("Please enter your name","Harry Potter"); if (name!=null && name!="") { ©Jibitesh Mishra, mishrajibitesh@gmail.com Example with Prompt cont… : Example with Prompt cont… document.write("Hello " + name + "! How are you today?"); } } </script> </head> <body> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example with Prompt cont… : Example with Prompt cont… <input type="button" onclick="show_prompt()" value="Show a prompt box" /> </body> </html> ©Jibitesh Mishra, mishrajibitesh@gmail.com Example with Prompt cont… : Example with Prompt cont… ©Jibitesh Mishra, mishrajibitesh@gmail.com If type Jibitesh Mishra & press OK button It will come as