WTL Assignment No. 4

Assignment No.
: 04
o Title:
Implement an application in Java Script using following:
a) Design UI of application using HTML, CSS etc.
b) Include Java script validation
c) Use of prompt and alert window using Java Script
e.g., Design and implement a simple calculator using Java Script for operations like
addition, multiplication, subtraction, division, square of number etc. a) Design calculator
interface like text field for input and output, buttons for numbers and operators etc. b)
Validate input values c) Prompt/alerts for invalid values etc.
o Date of performance:
o Date of submission:
o Sign:
Assignment No.04
o Aim:
Implement an application in Java Script using following:
a) Design UI of application using HTML, CSS etc.
b) Include Java script validation
c) Use of prompt and alert window using Java Script
e.g., Design and implement a simple calculator using Java Script for
operations like addition, multiplication, subtraction, division, square of
number etc. a) Design calculator interface like text field for input and output,
buttons for numbers and operators etc. b) Validate input values c)
Prompt/alerts for invalid values etc.
o Hardware/Software Requirements:
Software: Notepad, Browser
o Theory:
❖ JavaScript :
The HTML <script> tag is used to define a client-side script (JavaScript).

The <script> element either contains script statements, or it points to an
external script file through the src attribute. Common uses for JavaScript
are image manipulation, form validation, and dynamic changes of content.
You can place the <script> tags, containing your JavaScript, anywhere
within your web page, but it is normally recommended that you
should keep it within the <head> tags.
The script tag takes two important attributes:
• Language − This attribute specifies what scripting language

you are using. Typically, its value will be JavaScript. Although
recent versions of HTML (and XHTML, its successor) have
phased out the use of this attribute.
• Type − This attribute is what is now recommended to indicate
the scripting language in use and its value should be set
to"text/javascript".
Example,
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph
changed.";
}
</script>
</head>
<body>
<h2>Demo JavaScript in Head</h2>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">Try it</button>
</body>
</html>
Advantages:
The advantages of using JavaScript are −

• It requires less server interaction
• Immediate feedback to the visitors
• Increased interactivity
• Richer interfaces
Validation:
When client enters the all necessary data and press the submit
button form validation is done at server side If data entered by a client
is incorrect or missing, the server needs to send all data back to the
client and request for resubmission of form with correct information.
This is really a lengthy process which puts a lot of load (burden) on the
server.
So, JavaScript provides a way to validate form's data on the client's side
itself before sending it to the web server. Form validation performs two
functions-
• Basic Validation –First of all the form must be checked to make
sure all the mandatory fields are filled in. It would require just a
loop through each field in the form and check for the data.
• Data Format Validation− Secondly, the data that is entered must be
checked for correct format and its value. The code must include
appropriate logic to test correctness of data.
Alert 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.
Example
alert("I am an alert 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.
Example
let person = prompt("Please enter your name", "Harry Potter");
let text;
if (person == null || person == "") {
text = "User cancelled the prompt.";
} else {
text = "Hello " + person + "! How are you today?";
}
o Conclusion:
Thus, we have implemented an application in Java Script using,
a) HTML and CSS

b) JavaScript validation
c) JavaScript prompt and alert

WTL Assignment No. 4

Uploaded by

Copyright:

Available Formats

WTL Assignment No. 4

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

WTL Assignment No. 4

Uploaded by

Copyright:

Available Formats

Assignment No.

The HTML <script> tag is used to define a client-side script (JavaScript).

• Language − This attribute specifies what scripting language

The advantages of using JavaScript are −

a) HTML and CSS

You might also like