Javascript

Design the following form using HTML and CSS and validate the following fields
using JavaScript.
a. Name field must be length of 20 to 25 alphanumeric characters.
b. Password must be 8 alphanumeric character ended with *
c. Validate the gender field should be selected.
d. Validate the Pin code must be 6 digits.
e. Validate the degree field should be selected
CODE:
s<!—Main page-->
<!DOCTYPE html>
<html>
<body>
</form>
</body>
</html>
<!— form code-->
<html>
<head>
<title>Parkavi N 19MIS0113</title>
<style>
h3{
text-align: center;
}
table {
color:black;
background-color:light green;
border-style:solid;
border: 2px solid black;
padding:50 px;
}
table.inner{
bgcolor="green";
border: 0px
}
h1{ color: #d2691e ;}
</style>
</head>
<body>
<form>
<table align="center" cellpadding = "6">
<script>
function userid_validation(uid,mx,my)
{
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx)
{
alert("User Id should not be empty / length be between "+mx+" to
"+my);
uid.focus();
return false;
}
return true;
}
function alphanumeric(uadd)
{
var letters = /^[0-9a-zA-Z]+$/;
if(uadd.value.match(letters))
{
return true;
}
else
{
alert('User address must have alphanumeric characters only');
uadd.focus();
return false;
}
}function ValidateEmail(uemail)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(uemail.value.match(mailformat))
{
return true;
}
else
{
alert("You have entered an invalid email address!");
uemail.focus();
return false;
}
}
function formValidation()
{
var uid = document.registration.userid;
var passid = document.registration.passid;
var uname = document.registration.username;
var uadd = document.registration.address;
var ucountry = document.registration.country;
var uzip = document.registration.zip;
var uemail = document.registration.email;
var umsex = document.registration.msex;
var ufsex = document.registration.fsex; if(userid_validation(uid,5,12))
{
if(passid_validation(passid,7,12))
{
if(allLetter(uname))
{
if(alphanumeric(uadd))
{
if(countryselect(ucountry))
{
if(allnumeric(uzip))
{
if(ValidateEmail(uemail))
{
if(validsex(umsex,ufsex))
{
}
}
}
}
}
}
}
}
return false;
} function userid_validation(uid,mx,my)
{
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx)
{
alert("User Id should not be empty / length be between "+mx+" to
"+my);
uid.focus();
return false;
}
return true;
}
function passid_validation(passid,mx,my)
{
var passid_len = passid.value.length;
if (passid_len == 0 ||passid_len >= my || passid_len < mx)
{
alert("Password should not be empty / length be between "+mx+" to
"+my);
passid.focus();
return false;
}
return true;
}
function allLetter(uname)
{
var letters = /^[A-Za-z]+$/;
if(uname.value.match(letters))
{
return true;
}
else
{
alert('Username must have alphabet characters only');
uname.focus();
return false;
}
}
function alphanumeric(uadd)
{
var letters = /^[0-9a-zA-Z]+$/;
if(uadd.value.match(letters))
{
return true;
}
else
{
alert('User address must have alphanumeric characters only');
uadd.focus();
return false;
}
}
function countryselect(ucountry)
{
if(ucountry.value == "Default")
{
alert('Select your country from the list');
ucountry.focus();
return false;
}
else
{
return true;
}
}
function allnumeric(uzip)
{
var numbers = /^[0-9]+$/;
if(uzip.value.match(numbers))
{
return true;
}
else
{
alert('ZIP code must have numeric characters only');
uzip.focus();
return false;
}
}
function ValidateEmail(uemail)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(uemail.value.match(mailformat))
{
return true;
}
else
{
alert("You have entered an invalid email address!");
uemail.focus();
return false;
}
} function validsex(umsex,ufsex)
{
x=0;
if(umsex.checked)
{
x++;
} if(ufsex.checked)
{
x++;
}
if(x==0)
{
alert('Select Male/Female');
umsex.focus();
return false;
}
else
{
alert('Form Succesfully Submitted');
window.location.reload()
return true;
}
}
<tr>
<td><h1>personal details</h1>
<text align="centre"></td>
</tr>
<tr>
<td>name</td>
<td><input type="text" name="first_name" size="20-25"/>
</td>
</tr>
<td>Password</TD>
<td><input type="alphabet numbers" minilength="8"
maxlength="34"/></td>
</tr>
<tr>
<td><label for="email">Email:</label><td>
<td><input type="text" name="email" size="50" /><td>
</tr>
<TD><label id="gender">Sex:</label></TD>
<td><input type="radio" name="msex" value="Male"
/><span>Male</span><td>
<td><input type="radio" name="fsex" value="Female"
/><span>Female</span><td>
</tr>
<tr>
<td><label for="contacts"></label><td>
<td><input type="text" name="contacts" size="10" /><td>
</tr>
<tr>
<td><h1>educational qualification</h1>
<td><label for="degree"/></td>
<select name="degree" id="degree">
<optgroup label="select group">
<option value="m.tech"></option>
<option value="b,tech"></option>
</optgroup>
<td>engineering</td>
<optgroup label="select type">
<option value="B.E"></option>
<option value="M.E"></option>
</optgroup>
</select>
<td>hobbies</td>
<input type="checkbox" value="playing chess" name="" /></td>
<input type="checkbox" value="reading books" name=" "/></td>
<td>
<td><h1>address</h1>
<td><label for="address">Address:</label><td>
<td><input type="text" name="address" size="100" /><td>
</td>
<td><label>attach file</label></td>
<select name="upload" id="no file chosen">
<optgroup label="select group">
<option value="file.pdf"></option>
</form></td>
</tr>
<tr>
<td><input type="submit" name="submit" value="Submit" /></td>
</td></tr></table>
</form>
</body>
</html>
Write a JavaScript function Evaluate() that validates student registration form containing the following
elements: Name(text), Gender(radio), Mail-Id(text), Password(text), Confirm-Password(text), Mobile-
Number(text) and a Evaluate(button). Invoke the Evalute() function using onclick event. ( 9 marks)
a) The Name textfield must have only alphabets with 25 characters.
b) The gender field must be validated such that any one of the options (male/female) must be selected
by the user.
c) Mail-Id must be validated such that the username before @ should start with an alphabet and can
contain only one special character "-" (hyphen) as a part of the name. (Example :ram-krish@gmail.com)
d) The Password and Confirm-Password must be same.
e) The mobile number must have country code and then the number. The country code and the
number must be separated by a hyphen. (Example : 91-8034578921).
Write a HTML code to design an attendance details form, which
instruct the user to enter the course and attendance percentage. On
submission, the JavaScript should list the register numbers matches
with the attendance percentage against the list of register number and
attendance percentage stored in an associative array. Display the
course, and attendance percentage in header tag and list of register
numbers in an ordered list. (7 mrks)
The webmark.txt file contains 10 lines, where each line of the
file contains a one word user name and test score separated
by spaces. Write a PHP code that scan through the file add 5
points to each test score which is less than 50 and outputs the
user names and test scores to a new file result.txt
Design the following form using and validate the form using JavaScript based on
the following constraints.
a. Full Name should be length of atleast 15 characters
b. Gender field must be selected
c. Nationality must be selected
d. Skills should be more than one
Only form
<html>
<body>
<fieldset>
<legend>Application form</legend>
<table>
<form>
<tr>
<td>Full Name</td>
<td><input type="text" name="id"/></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email"/></td>
</tr>
<tr>
<td>Gender</td>
<td><input type="radio" name="ru"/> male<input type="radio"
name="ru"/>Female</td>
</td>
</tr>
<tr>
<td>Nationality</td>
<td><select name="na">
<option name="na">india</option>
<option name="na">usa</option>
<option name="na">pak</option>
</td>
</tr>
<tr>
<td>skills</td>
<td><input type="checkbox" name="ch"/>asp.net<input
type="checkbox" name="ch"/>MVC
<input type="checkbox" name="ch"/>JQuery<input type="checkbox"
name="ch"/>sql server</td>
</tr>
<tr>
<td>post applying</td>
<td><input type="radio" name="cr"/>trainee<input type="radio"
name="ch"/>sofatware engineer
<input type="radio" name="ch"/>team leader<input type="radio"
name="ch"/>projecr manager</td>
</tr>
<tr>
<td>Upload resume</td>
<td><input type="file" name="gh"/></td
</tr>
<tr>
<td> paste your resume </td>
<td><input type="textarea" name="jg"/></td>
</tr>
<tr>
<td><input type="checkbox" name="oi"/>notify me the status via
email</td>
</tr>
<tr>
<td><input type="radio" name="pi"/>i agree to trems & condtions</td>
</tr>
<tr>
<td align="center"><input type="submit" name="ty"/><input
type="reset" name="to"/></td>
</tr>
</fieldset>
</table>
</form>
</body>
</html>
With js
<html>
<body>
<script src="field-level-sample-registration-form-validation.js"></script>
<fieldset>
<legend>Application form</legend>
<table>
</head>
<body onload="firstfocus();">
<h1>Apllication form</h1>
<form name='registration'">
<tr>
<td>Full Name</td>
<td><input type="text" name="id"/></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email"/></td>
</tr>
<tr>
<td>Gender</td>
<td><input type="radio" name="ru"/> male<input type="radio"
name="ru"/>Female</td>
</td>
</tr>
<tr>
<td>Nationality</td>
<td><select name="na">
<option name="na">india</option>
<option name="na">usa</option>
<option name="na">pak</option>
</td>
</tr>
<tr>
<td>skills</td>
<td><input type="checkbox" name="ch"/>asp.net<input type="checkbox"
name="ch"/>MVC
<input type="checkbox" name="ch"/>JQuery<input type="checkbox"
name="ch"/>sql server</td>
</tr>
<tr>
<td>post applying</td>
<td><input type="radio" name="cr"/>trainee<input type="radio"
name="ch"/>sofatware engineer
<input type="radio" name="ch"/>team leader<input type="radio"
name="ch"/>projecr manager</td>
</tr>
<tr>
<td>Upload resume</td>
<td><input type="file" name="gh"/></td
</tr>
<tr>
<td> paste your resume </td>
<td><input type="textarea" name="jg"/></td>
</tr>
<tr>
<td><input type="checkbox" name="oi"/>notify me the status via email</td>
</tr>
<tr>
<td><input type="radio" name="pi"/>i agree to trems & condtions</td>
</tr>
<tr>
<td align="center"><input type="submit" name="ty"/><input type="reset"
name="to"/></td>
</tr>
</fieldset>
JavaScript Code:
function firstfocus()
{
var name = document.registration.name.focus();
return true;
}
// This function will validate Name.
function allLetter()
{
var uname = document.registration.username;
var letters = 15/^[A-Za-z]+$/;
if(uname.value.match(letters))
{
// Focus goes to next field i.e. Address.
document.registration.address.focus();
return true;
}
else
{
alert('Username must have alphabet characters only');
uname.focus();
return false;
}
}
}
// This function will select nationality.
function nationalityselect()
{
var ucountry = document.registration.country;
if(ucountry.value == "Default")
{
alert('Select your country from the list');
ucountry.focus();
return false;
}
Design an attractive Diwali greeting to your friend using HTML and CSS. Write a
JavaScript code to change the image, greeting content background color, text
color, font size based on the user choice using any one of the form control / DOM
method
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
body {background-color: powderblue;}
</style>
<title>Change the Background Color with JavaScript</title>
<script>
// Function to change webpage background color
function changeBodyBg(color){
document.body.style.background = color;
}
// Function to change heading background color
function changeHeadingBg(color){
document.getElementById("heading").style.background = color;
}
function changefont(size){
document.getElementbyId("demo").style.fontSize="x-large";
}
</script>
</head>
<body>
<h1 id="heading">happy Diwali! Ravi</h1>
<p>May your life also be filled with colours and lights of
happiness</p>
<hr>
<div>
<label>Change Webpage Background To:</label>
<button type="button"
onclick="changeBodyBg('yellow');">Yellow</button>
onclick="changeBodyBg('lime');">Lime</button>
onclick="changeBodyBg('orange');">Orange</button>
</div>
<br>
<div>
<label>Change Heading Background To:</label>
onclick="changeHeadingBg('red');">Red</button>
onclick="changeHeadingBg('green');">Green</button>
onclick="changeHeadingBg('blue');">Blue</button>
</div>
<div>
<label>Change font To:</label>
onclick="changefont('X-large');">X-large</button>
onclick="changefont('large');">large</button>
</div>
</body>
</html>
Design a form for online driving license issue using HTML and Javascript.
Consider the fields- Name, Age and Address (text boxes). If the age is less than
18, issue an error message. Otherwise, compute the expiry date [Today’s
date+ 15years] of the license. Assume that the validity of the driving license is
for 15 years. Display the license with all given details. (using Java Script)
[Form should be validated for empty text boxes.]
<html>
<body>
<h1 >Driving license</h1>
<form name="myForm" onsubmit="return validateForm()" method="post">
Name: <input type="text" name="fname">
<br/> <br/>
Age : <input type="text" name="mno">
<br/> <br/>
Address : <input type="text" name="adr">
<br/> <br/>
<input type="submit" value="Submit">
</form>
<br/><br/><br/>
<table id ="outtab" border ="2" bordercolor="blue">
<tr><td colspan="2">FORM OUTPUT</td></tr>
<tr><td>Name</td><td></td></tr>
<tr><td>Age</td><td></td></tr>
<tr><td>Address</td><td></td></tr>
<tr><td>Expiry date</td><td></td></tr>
</table>
<button onclick="validateForm()">Display</button>
<script>
function validateForm() {
x = document.myForm.fname.value;
y=document.myForm.mno.value;
z=document.myForm.adr.value;
if (test(x))
{
if (test1(y))
{
if(test2(z))
{
return true;
}} }
return false;
}
function test(x)
{
var npat=/\w{1}/;
if (x.match(npat)) {
document.getElementById("outtab").rows[1].cells[1].innerHTML=x;
return true;
}
alert("Name must be filled");
return false;
}
function test1(y)
{
var mpat=/\d{1}/;
if (y.match(mpat)) {
document.getElementById("outtab").rows[2].cells[1].innerHTML=y;
return true;
}
alert("age must be filled");
return false;
}
function test2(z)
{
var opat=/\d{10}/;
if (z.match(opat)) {
document.getElementById("outtab").rows[3].cells[1].innerHTML=z;
return true;
}
alert("adress must be filled");
return false;
}
</script>
</body>
</html>
5. Design a HTML form which contains two text box labelled as

string1, string2 and submit button labelled as match. Once you click
the match button, the two strings are then passed into a function
named as check, which returns how many matches there are
between the strings and display the output in heading 2 tag with
blue color text and lime background. A match is where the two
sstrings have the same character at the same index. For instance,
‘python’ and ‘path’ match in the first, third and fourth character, so
the function should return 3.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Javascript code</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initialscale=
1" />
<link rel="stylesheet" href="" />
</head>
<body>
<h1 style="color: blue" class="heading"></h1>
<form>
<input
name="string1"
id="item1"
type="text"
placeholder=" string 1"
/>
<input
name="string2"
id="item2"
type="text"
placeholder=" string 2"
/>
<input type="submit" />
</form>
<script>
document.querySelector("form").addEventListener("submit",
submitForm);
function submitForm(e) {
var len = 0;
e.preventDefault();
const item1 = document.querySelector("#item1").value;
const item2 = document.querySelector("#item2").value;
for (i = 0; i < item1.length; i++) {
for (j = 0; j < item2.length; j++) {
if (j < item1.length) {
if (item1[i] === item2[j]) {
len = len + 1;
}
}
}
}
document.querySelector(".heading").textContent = len;
}
</script>
</body>
</html>
3. Create a HTML form which contains two Text fields and submit button.
Name the text fields as account number and amount and submit button
labelled as “Deposit”. Write a JavaScript code to create an associative array
bank which contains key as account number and amount as value. Check the
account number retrieved from the form with the account number in the
bank, if it exists, add the existing amount with the amount retrieved from the
form and display the output in paragraph tag with 20px font size.
<!DOCTYPE html>
<html>
<body>
<form name="myForm" onsubmit="return validateForm()" >
Account number : <input type="text" name="accnum">
<br/> <br/>
Amount : <input type="text" name="amount">

<br/> <br/>
<input type="submit" value="Deposit">
</form>
<br/><br/><br/>
<h1> OUTPUT </h1>
<p style="font-size:20px;" id="out">account num: </p>
<p style="font-size:20px;" id="out1" > balance: </p>
<button onclick="validateForm()">Display</button>
<script>
var accnum = new
Array("9658741230369854","2587410369987456","9632587410369852","15896
478936547896","1236547890321654");
var accnumString="";
for (var i = 0; i < accnum. length; i++) {
accnumString += accnum[i] + " ";
}
function validateForm() {
x = document.myForm.accnum.value;
y=document.myForm.amount.value;
if (test(x))
{
if (test1(y))
{
return true;
}}
return false;
}
function test(x)
{
var npat=/\w{16,}/;
if (x.match(npat)) {
document.getElementById("out").innerHTML=x;
return true;
}
alert("accnum is not matched");
return false;
}
function test1(y)
{
var mpat=/\d{1}/;
if (y.match(mpat)) {
document.getElementById("out1").innerHTML=y;
return true;
}
alert("Enter amount ");
return false;
}
</script>
</body>
</html>
2) Design a Secret HTML form which contains text box labelled as Secret message, two buttons labelled
as encrypt and decrypt, when you click the encrypt button which will display the encrypted code in
Heading 1 tag with red color text and blue background, similarly when you click decrypt button, which
will display the output in Heading 1 tag with blue color text and lime background. Use the following
procedure for encryption and decryption. One way to rearrange the characters is to pick out the
characters at even indices, put them in the encrypted string and follow them by the odd characters. For
example, the string message would be encrypted as msaeesg because the even characters are m,s,a,e
(at indices 0,2,4 and 6) and the odd characters are e,s,g (at indices 1,3,5)
<!DOCTYPE html>
<html>
<body>
<form name="form1" method="post">
Secret message:<input type="text" name="secretmsg">
</form>
<button name="encrypt" onclick="encrypt()">encrypt</button>
<button name="decrypt" onclick="decrypt()">decrypt</button>
<h1 id="output"><h1>
<script>
function encrypt()
{
var x=document.form1.secretmsg.value;
document.getElementById("output").innerHTML=x;
document.getElementById("output").style.color = "red";
document.getElementById("output").style.backgroundColor = "blue";
}
function decrypt()
{
var y=document.form1.secretmsg.value;
document.getElementById("output").innerHTML=y;
document.getElementById("output").style.color = "blue";
document.getElementById("output").style.backgroundColor = "lime";
}
</script>
</body>
</html>
Output:
Associative array manipulation
1.Search the value in an associative array
<html>
<body>
<form name ="sample">
<table>
<tr>
<td> Employee number</td>
<td> <input type ="text" name ="empid"/></td></tr>
<tr><td> Employee name </td>
<td id ="emp"></td></tr>
</table>
</form>
<button onclick="Invoke();">Result </button>
<script>
function Invoke()
{
var x =document.sample.empid.value;
var E = {"100":"Sam", "101":"Ram", "102":"Lam"};
var flag = 0;
for(var index in E) {
if (index==x)
{
flag =1;
document.getElementById("emp").innerHTML =E[index];
}
}
if (flag==0)
{
alert("This employee not belong to this organization");
}
}
</script>
</body>
</html>
2.Insertion in an associative array
<html>
<body>
<table>
<tr>
<tr><td> Employee name </td>
<td id ="emp"></td></tr>
</table>
</form>
<script>
function Invoke()
{
var E = {"100":"Sam", "101":"Ram", "102":"Lam"};
var flag = 0;
if (index==x)
{
flag =1;
document.getElementById("emp").innerHTML =E[index];
}
}
if (flag==0)
{
alert("Not in the list");
var y = prompt("Enter Employee name:");
E[x] = y;
alert("New value added in an associative array");
document.write( index + ":" + E[index]+"<br/>");
}
}
}
</script>
</body>
</html>
3.Deletion in an associative array
<html>
<body>
<table>
<tr>
</table>
</form>
<script>
function Invoke()
{
var E = {"100":"Sam", "101":"Ram", "102":"Lam"};
var flag = 0;
if (index==x)
{
flag =1;
delete E[x];
for(var i in E) {
document.write( i + ":" + E[i]+"<br/>");
}
}
}
if (flag==0)
{
alert("This employee not belong to this organization");
}
}
</script>
</body>
</html>
<html>
<head>
<title>DARSHNI form validation</title>
<script type="text/javascript">
function validate()
{
name(document.getElementById("name").value);
password(document.getElementById("password").value);
mail(document.getElementById("email").value);
num(document.getElementById("phoneno").value);
gender(document.getElementById("gender").value);
}
function stringLengthCheck(name, minlength, maxlength)
{
var mnlen = minlength;
var mxlen = maxlength;
if(name.value.length<mnlen || name.value.length> mxlen)
{
alert("Name should be " +mnlen+ " to " +mxlen+ " characters.");
return false;
}
else
{
return true;
}
}
function matchPassword() {
var pw1 = document.getElementById("password");
var pw2 = document.getElementById("retype");
if(password != retype)
{
alert("Passwords did not match");
} else {
alert("Password created successfully");
}
}
function mail(email)
{
atp=email.indexOf("@");
dotp=email.lastIndexOf(".");
if (atp<1 || dotp<atp+2 || dotp+2>=email.length)
alert("Enter a valid E-mail ID");
}
function num(phoneno)
{
if(phno.length<10)
alert("Enter a valid phoneno");
}
function validate(gender)
{
var genderM=form.gender_male.value;
var genderF=form.gender_female.value;
if(genderM.checked==false && genderF.checked==false )
{
alert("You must select male or female");
return false;
}
}
</script>
</head>
<body>
<center>
<form>
<table>
<tr>
<h1>
Form Validation
</h1>
</tr>
<tr>
<td>Name:</td><td><input name="name" id="name" type="text"
maxlength="20"
onclick="stringLengthCheck(document.form1.name, 15,
20)"/></td>
</tr>
<tr>
<td>Username:</td><td><input id="username" type="text"></td>
</tr>
<tr>
<td>Password:</td><td><input id="password" type="text"></td>
</tr>
<tr>
<td>Re-type password</td><td><input id="retype"
type="text"></td>
</tr>
<tr>
<td>Gender</td><td>
<input type="radio" name="gender" value="0">Male</input>
<input type="radio" name="gender" value="1">Female</input>
</tr>
<tr>
<td>Programming skills</td><td>
<input type="checkbox" id="progsk" name="programskills1"
value="java">
<label for="option1"> Java</label>
<input type="checkbox" id="progsk2" name="programskills2"
value="android">
<label for="option2">Android</label>
value="ruby">
<label for="option3">Ruby</label>
value="net">
<label for="option4">Net</label>
</td>
</tr>
<tr>
<td>Contact no:</td><td><input id="phoneno" type="text"
maxlength="10"></td>
</tr>
<tr>
<td>E-Mail ID:</td><td><input id="email" type="text"></td>
</tr>
<tr>
<td>College:</td><td>
<select id="college">
<option value="op1">select college</option>
<option value="op2">VIT</option>
<option value="op3">NIT</option>
<option value="op4">IIT</option>
</td>
</tr>
<tr><td colspan="2"><input type="submit"
onclick="validate();"></td></tr>
</select>
</table>
</form>
</center>
</body>
</html>
Design a form in HTML which consists of two text fields to get two numbers and
add, subtract and multiply buttons. Write a JavaScript code to invoke the
relevant button and display output using Header 1 with background color as
lime using DOM event.
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JavaScript program to calculate multiplication of two numbers </title>
<style type="text/css">
body {margin: 30px;}
</style>
</head>
<header>
<h1 style="background-color:lime;">A heading here</h1>
</header>
<body>
<form>
1st Number : <input type="text" id="firstNumber" /><br>
2nd Number: <input type="text" id="secondNumber" /><br>
<input type="button" onClick="addBy()" Value="add" />
<input type="button" onClick="subtractBy()" Value="subtract" />
<input type="button" onClick="multiplyBy()" Value="Multiply" /
</form>
<p>The Result is : <br>
<span id = "result"></span>
</p>
</body>
</html>
<script>
function additionBy()
{
num1 = document.getElementById("firstNumber").value;
num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num1 + num2;
}
function subtractionBy()
{
document.getElementById("result").innerHTML = num1-num2;
}
function multiplyBy()
{
document.getElementById("result").innerHTML = num1 * num2;
}
</script>

Javascript

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

Javascript

Uploaded by

Copyright:

Available Formats

Design the following form using HTML and CSS and validate the following fields

a. Name field must be length of 20 to 25 alphanumeric characters.

b. Password must be 8 alphanumeric character ended with *

c. Validate the gender field should be selected.

d. Validate the Pin code must be 6 digits.

e. Validate the degree field should be selected

a) The Name textfield must have only alphabets with 25 characters.

d) The Password and Confirm-Password must be same.

a. Full Name should be length of atleast 15 characters

b. Gender field must be selected

c. Nationality must be selected

d. Skills should be more than one

5. Design a HTML form which contains two text box labelled as

Amount : <input type="text" name="amount">

Associative array manipulation

1.Search the value in an associative array

2.Insertion in an associative array

3.Deletion in an associative array

You might also like