0% found this document useful (0 votes)
14 views

5 DialogBoxes

Uploaded by

yevitoy306
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
14 views

5 DialogBoxes

Uploaded by

yevitoy306
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 12

TEMPLATE STRINGS

&
DIALOG BOXES
Using Template String
• ES6 has introduced a much simpler way of concatenating variable’s value inside a
message called Template String

• It helps us avoid + operator for concatenation.

• To use template string we take 2 steps:


•Use back ticks for enclosing the message

•Use ${ var_name} wherever we want to show the variable’s value


Using Template String
SYNTAX : ` some text ${var_name} some more text `

EXAMPLE :
let x=10;
console.log(`Value of x is ${x}`);
Using Template String

• We can even write expressions or function calls inside template strings and they will
be evaluated by JS and the result of expression will be inserted in template string

EXAMPLE :
let x=10;
console.log(`Twice of ${x} is ${x*2}`);

EXAMPLE :
let x=16;
console.log(`Squareroot of ${x} is ${Math.sqrt(x)}`);
Using Dialog Boxes
JavaScript allows us to display messages using dialog boxes.

There are 3 kinds of dialog boxes provided by JavaScript

alert prompt confirm


Alert Dialog Boxes
An alert dialog box is mostly used to give a warning message to the users.

Like if an input field requires to enter some text but user does not enter that field
then as a part of validation we can use alert box to give warning message.

Syntax:

alert(‘message to show’);
Prompt Dialog Boxes

The prompt dialog box is very useful when we want to pop-up a text box to get user
input. Thus it enables us to interact with the user. The user needs to fill in the field and
then click OK.

Syntax:

prompt(‘message’,’default text’);
This dialog box is displayed using a method called prompt() which takes
two parameters:

A label which we want to display in the text box

A default string to display in the text box.(optional)

This dialog box comes with two buttons: OK and Cancel.

If the user clicks on OK button the method prompt() will return entered value
from the text box. If the user clicks on the Cancel button the
method prompt() returns null.
Accepting Numeric Input
Since prompt( ) returns everything as a string so if we want to accept numbers then we need
to use either of 2 methods:

parseInt( ) parseFloat( )

Syntax:

let a=parseInt(value to convert);


let a=parseFloat(value to convert);
Confirm Dialog Boxes
A confirmation dialog box is mostly used to take user's consent on any option. It
displays a dialog box with two buttons: OK and Cancel.

If the user clicks on OK button the window method confirm() will return true. If the
user clicks on the Cancel button confirm() returns false.

Syntax:

confirm(‘question to ask’);
Important Point

• The methods alert( ),prompt( ) and confirm( ) are methods of window object.

• Thus they can be called using the notation window.<method name>( ) also.

EXAMPLE : window.alert(‘Good Evening’);

• But since window object is the default object we can directly call these methods.

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy